Components: Ability to pass data to a ComponentPortal

Created on 9 Nov 2017  路  8Comments  路  Source: angular/components

Bug, feature request, or proposal:

I'm trying to pass data to a portal (I'm using ComponentPortal), but so far, there's no possible way to do so.

What is the expected behavior?

Able to pass data to a ComponentPortal

What is the current behavior?

Can't pass data to a ComponentPortal

What are the steps to reproduce?

Providing a StackBlitz/Plunker (or similar) is the best way to get the team to see your issue.

Plunker starter (using on @master): https://goo.gl/uDmqyY

StackBlitz starter (using latest npm release): https://goo.gl/wwnhMV

What is the use-case or motivation for changing an existing behavior?

I want to show a code snippet with a param passed in as part of the code snippet.

Something like this:

<code-viewer language="html">
&lt;mat-icon svgIcon="{{selectedIcon}}"&gt;&lt;/mat-icon&gt;
</code-viewer>
export class CodeSnippetComponent {
    selectedIcon: string; // <- How to declare this?
}



md5-091fb02b001076b7d055d3da1dd7682d



Angular v5.0.1
Angular Material v5.0.0-rc.0
Typescript 2.4.2
macOS High Sierra 10.13.1
Google Chrome Version 63.0.3239.30 (Official Build) beta (64-bit)

Is there anything else we should know?

NIL

Most helpful comment

Closing as this is already supported.

You can pass data into a ComponentPortal using the injector. An example of this can be seen in the dialog here using the injector that is created here

None of the links are working. Struggling with this issue. Please show us how to pass data in a manageable way

All 8 comments

I think you can inject this data by using Injector

@atishin Errr... How do you inject data?

Closing as this is already supported.

You can pass data into a ComponentPortal using the injector. An example of this can be seen in the dialog here using the injector that is created here

@josephperrott My ComponentPortal seems unable to resolve some dependencies of root provided services. What's required to inject Services next to the injected Data? thanks!

Closing as this is already supported.

You can pass data into a ComponentPortal using the injector. An example of this can be seen in the dialog here using the injector that is created here

None of the links are working. Struggling with this issue. Please show us how to pass data in a manageable way

link for dialog

@josephperrott is there a way to simply pass @Input data using ComponentPortal?

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings