A simple example of creating dynamic components with custom injectors and injection tokens. See commit history for alternative approaches.
This project was generated with Angular CLI version 8.0.3.
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
This project provides only a surface-level introduction to these features. For a deeper explanation, please see the following:
- FCC Angular Web Components Modal Component - similar to this, but it's capable of passing data back from the content component!
- https://malcoded.com/posts/angular-dynamic-components/ - tutorial that directly inspired much of this code
- https://www.youtube.com/watch?v=EoSn8qASqQA - excellent 2017 talk by an Angular team member on DI, injection tokens, and how these can be applied to in an example 'wizard' component. Covers of a lot of great angular concepts.
- https://angular.io/guide/hierarchical-dependency-injection - official Angular docs on hierarchical dependency injection
- https://codecraft.tv/courses/angular/dependency-injection-and-providers/overview/ - a nice introduction to dependency injection and providers in Angular. This gently introduces some details that we typically don't get into day-to-day at FCC.
- https://blog.angularindepth.com/angular-dependency-injection-and-tree-shakeable-tokens-4588a8f70d5d - All you ever wanted to know about the Angular DI tree, with a big 'ol diagram of the tree that is more detailed and complex than other resources. Pack a lunch.