Is it good idea to use ComponentFactoryResolver in Angular7 application?

Yes it is good to use the ComponentFactoryResolver that is why it is in the official documentation. It is stable it is inside since Angular 2. It has no significant performance hit.

Many Angular libraries use it internally also the Angular Material library. Check the Portal inside the Component Development Kit (CDK) and its source in GitHub where you can see it being used for displaying dynamic content inside it.

Regarding your question if it is better to do NgSwitch or create components using the ComponetFactoryResolver is difficult to answer since it depends on what you are trying to do and you did not explain what exactly is your scenario. I would say that in most cases you should use the ComponentFactoryResolver since it allows you to add any component dynamically and you don't have a big component with a huge NgSwitch for all possible dynamic components. Only in the case you have a very small number of dynamic components and you don't expect new ones will be added it might be more easy to create them using NgSwitch.


As a complement to the previous answer, to better compare the two methods, it might be worth adding a few details on what is going on in each case.

Steps to 'create' a component with the FactoryResolver service:

  1. instantiate a component class using the resolveComponentFactory() method: this method takes, as parameter, the component type, and looks for the corresponding 'component factory'.
    Nb: the component factories are classes created by Angular for each declared component with the purpose to instantiate new components
  2. 'append' the new component to the view using the createComponent() method of the ViewContainerRef class

For information: https://angular.io/guide/dynamic-component-loader#resolving-components

Steps applied when a structural directive (ngIf, ngSwitch...) 'creates' a component:

  1. the directive creates an embedded view with the supplied template. For this, it also uses the ViewContainerRef class (the createEmbeddedView() method).
  2. in case where this view contains a component selector, Angular instantiates a new component class, also using the corresponding factory, which will be appended to the view.

=> the two methods go roughly through the same steps (actually the 'structural directive' method adds an additional step, the creation of an embedded view, which, I think, is negligible).

Therefore, in my opinion, the most valuable reason to choose one out of the two options is the use case, which I would summerize as the following:

Structural directive (ngIf, ngSwitch...):

  • useful when there are few components

FactoryResolver service:

  • avoids a long list of components (as mentioned in previous answer)
  • better separation of concerns (the template, or the parent component, may not need to be aware of a list of all components which might be instantiated)
  • required to lazy load the dynamic components (I recommend this for more information: https://blog.angularindepth.com/here-is-what-you-need-to-know-about-dynamic-components-in-angular-ac1e96167f9e )