Ability to pass data to a ComponentPortal
See original GitHub issueBug, 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">
<mat-icon svgIcon="{{selectedIcon}}"></mat-icon>
</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
Issue Analytics
- State:
- Created 6 years ago
- Comments:8 (2 by maintainers)
Top Results From Across the Web
Passing data to and from a ComponentPortal in Angular CDK
What you can do is to pass the data which you want to use as @Input using the attached event of portal. Check...
Read more >How to provide data to ComponentPortal using Dependency ...
3) Switch to the “provide-data-to-component-portal” branch. 4) Create a new branch “my-solution” from a specific commit which contains the ...
Read more >Inject dynamic content in Angular components with portals
To pass context data in templatePortal , we can use the context property. // TypeScript this.portal.context = {}; ...
Read more >How do CDK Portals work? - Medium
The viewRef variable now contains an in-memory rendered view, allowing us to pass it along to a “Portal host” which is responsible for...
Read more >How to pass an Input into a ComponentPortal ? : r/Angular2
At the moment, I am stuck trying to find an efficient way to load Input variables into components while they are loaded. Typescript...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
None of the links are working. Struggling with this issue. Please show us how to pass data in a manageable way
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