angular - iconNameとプレフィックスでfontawesomeアイコンを動的にロードする方法は?

Question

fontawesome アイコンの動的ロードに関する問題を iconName で調査しました。しかし、コードは機能していません。理由は何ですか？ベストプラクティスは何ですか? そして、なぜディレクティブ ngOnInit() フックで ngOnChanges() の呼び出しが必要なのですか? ブラウザーに表示されるエラーは、「FontAwesome: アイコンが見つかりませんでした。このコンポーネントに null または未定義のアイコン オブジェクトを提供したようです。」

import { AppComponent } from './app.component';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library, dom } from '@fortawesome/fontawesome-svg-core';
import { fas,faCheck, faCalendar, faTimes } from '@fortawesome/free-solid-svg-icons';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { IconDirective } from './icon.directive';

@NgModule({
  declarations: [AppComponent, IconDirective],
  imports: [BrowserModule, FontAwesomeModule],
  providers: [],
  bootstrap: [AppComponent],
  entryComponents: [FaIconComponent],
})
export class AppModule {
  constructor() {
    library.add(fas,faCheck, faCalendar, faTimes);
    dom.watch();
  }
}

import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    template: '<div iconDirective></div>'
})
export class AppComponent {
    constructor() { }
}

import { Directive, OnInit, ViewContainerRef, ComponentFactoryResolver }
from '@angular/core';
import { FaIconComponent } from '@fortawesome/angular-fontawesome';
import { faCheck, faCalendar, faTimes } from '@fortawesome/free-solid-svg-icons';
import { icon } from '@fortawesome/fontawesome-svg-core';

@Directive({
  selector: '[iconDirective]'
})
export class IconDirective{
   constructor(      
      public viewContainerRef: ViewContainerRef,
      private componentFactoryResolver: ComponentFactoryResolver) {
    }
    ngOnInit() {
      const componentFactory =
          this.componentFactoryResolver.resolveComponentFactory(FaIconComponent);
      const componentRef =
          this.viewContainerRef.createComponent(componentFactory);
      (<FaIconComponent>componentRef.instance).icon =
           icon({iconName: 'times', prefix: 'fas'});
      // (<FaIconComponent>componentRef.instance).iconProp = faCheck; //works
      (<FaIconComponent>componentRef.instance).ngOnChanges({});
    }
}