Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ability to pass data to a ComponentPortal #8322

Closed
EdricChan03 opened this issue Nov 9, 2017 · 8 comments
Closed

Ability to pass data to a ComponentPortal #8322

EdricChan03 opened this issue Nov 9, 2017 · 8 comments

Comments

@EdricChan03
Copy link
Contributor

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?
}

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

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

@atishin
Copy link

atishin commented Nov 9, 2017

I think you can inject this data by using Injector

@EdricChan03
Copy link
Contributor Author

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

@josephperrott
Copy link
Member

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

@matheo
Copy link

matheo commented Apr 19, 2019

@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!

@mmezian
Copy link

mmezian commented Jul 3, 2019

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

@NithinBiliya
Copy link

link for dialog

@nissoh
Copy link

nissoh commented Jul 18, 2019

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

@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 11, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants