Componentresolver vs *ngif в angular

---

Ниже я создал динамический компонент

AppComponent.html

<input type="button" value="One" (click)="setVal('one')">
<input type="button" value="Two" (click)="setVal('two')">
<br>
<app-dynamic-component [key]="keyvalue"></app-dynamic-component>

AppComponent.ТС

keyvalue = 'one'

setVal(val) {
    this.keyvalue = val;
}

и его логи следующие:

Консольный журнал здесь


----------


А следующие используют `*ngIf`

AppComponent.html

<input type="button" value="One" (click)="setVal('one')">
<input type="button" value="Two" (click)="setVal('two')">
<br>
<app-component-one *ngIf="keyvalue=='one'"></app-component-one>
<app-component-two *ngIf="keyvalue=='two'"></app-component-two>

AppComponent.ТС

keyvalue = 'one'

setVal(val) {
    this.keyvalue = val;
}

и журналы:

Консольный журнал здесь


----------

Оба делают одно и то же-создают и уничтожают дочерние компоненты. В чем преимущество использования ComponentFactoryResolver над *ngIf и давайте скажем *ngIf делает свою работу, должен ли я использовать ComponentFactoryResolver вместо этого?

Что я уже пробовал:

Реализовал оба варианта, но я не знаю, какой из них лучше.

---