angular 4+ assign @Input for ngComponentOutlet dynamically created component

by

Such a feature was discussed in the pull request for ngComponentOutlet but was dropped for now.
Even the componentRef shown currently in https://angular.io/docs/ts/latest/api/common/index/NgComponentOutlet-directive.html is not public and therefore not available https://github.com/angular/angular/blob/3ef73c2b1945340ca6bd21f1790260c88698ae26/modules/%40angular/common/src/directives/ng_component_outlet.ts#L78

I’d suggest you create your own directive derived from https://github.com/angular/angular/blob/3ef73c2b1945340ca6bd21f1790260c88698ae26/modules/%40angular/common/src/directives/ng_component_outlet.ts#L72

and assign values to inputs like shown in Angular 2 dynamic tabs with user-click chosen components

this.compRef.instance.someProperty = 'someValue';

More Related Contents:

  1. typescript anonymous object with variable based label value
  2. How do I return the response from an Observable/http/async call in angular?
  3. How to load external scripts dynamically in Angular?
  4. Property ‘…’ has no initializer and is not definitely assigned in the constructor
  5. Can’t bind to ‘ngModel’ since it isn’t a known property of ‘input’
  6. Angular 2: How to detect changes in an array? (@input property)
  7. Angular: Can’t find Promise, Map, Set and Iterator
  8. Angular 2 router event listener
  9. Angular2 component’s “this” is undefined when executing callback function
  10. Angular 2: TypeError: l_thing0 is undefined in [{{thing.title}} in AppComponent@4:44]
  11. Load existing components dynamically Angular 2 Final Release
  12. Angular 5 Scroll to top on every Route click
  13. How to handle window scroll event in Angular 4?
  14. Prevent IE11 caching GET call in Angular 2
  15. Nested arrays in Angular 2 reactive forms?
  16. Angular: In which lifecycle hook is input data available to the Component
  17. Angular 4 Filter Search Custom Pipe
  18. Correct way Provide DomSanitizer to Component with Angular 2 RC6
  19. Angular 2 typescript invoke javascript function
  20. Whats the difference between using a class and interface?
  21. What does Angular 2 hashtags in template mean?
  22. How to loop over object properties with ngFor in Angular
  23. Converting an image to base64 in angular 2
  24. Angular 6: ERROR TypeError: “… is not a function” – but it is
  25. Angular interceptor exclude specific urls
  26. How to iterate using ngFor loop Map containing key as string and values as map iteration
  27. TypeScript TS7015: Element implicitly has an ‘any’ type because index expression is not of type ‘number’
  28. Property ‘catch’ does not exist on type ‘Observable’
  29. angular 2 access ng-content within component
  30. binding data to angular checkbox

Leave a Comment