コンポーネントに型を渡してその型を工場に転送する

Question

Angular 2とTypeScriptを使用してファクトリメソッドを作成しようとしていますが、TSCコンパイラが誤ったエラーを投げているため、

error TS1005: ',' expected. 

私はこのようなコンポーネントに@Input()として型を渡すしようとしています：

<custom-user [componentType]="CreateMeComponent"></custom-user> 

私はこのコードを持っている：

// custom-user.component.ts 
export class GalleriaCustomUserComponent implements OnChanges { 
    @Input() componentType: any; // is there a type for types, other than any? 
    @ViewChild(ComponentDirective) componentAnchor: ComponentDirective; 

    ngAfterViewInit() { 
     this.componentAnchor 
      .createComponent<this.componentType>(); // this line throws the ',' error 
    } 
} 

を

そしてディレクティブは次のようになります。

// component.directive.ts 
@Directive({ 
    selector: '[componentAnchor]' 
}) 
export class ComponentDirective { 
    constructor(
     private viewContainer: ViewContainerRef, 
     private componentFactoryResolver: ComponentFactoryResolver 
    ) {} 

    public createComponent<MyComponent>() { 
     this.viewContainer.clear(); 

     let componentFactory = 
      this.componentFactoryResolver.resolveComponentFactory(MyComponent); 
     let componentRef = this.viewContainer.createComponent(componentFactory); 

     return componentRef; 
    } 
} 

これは可能ですか？それとも悪いデザインですか？

Answer 1

ビューバインドでタイプ名を使用することはできません。コンポーネントインスタンスまたはテンプレート変数への参照のみがサポートされています。その後、あなたはそれを使用することができ、コンポーネントのプロパティにタイプを割り当てます。あなたの答えのための

<custom-user [componentType]="createMeComponent"></custom-user> 

createMeComponent = CreateMeComponent;