Angular 2共享组件，组件作为属性

Question

我有一个可以显示切换按钮的共享组件，这个切换按钮允许您在两个子组件之间切换，这两个组件必须作为输入从调用SharedComponent的父组件传递。 请问有什么想法？

Answer 1

我认为ngComponentOutlet正是您所寻找的： https://angular.io/api/common/NgComponentOutlet

然后你可以这样做：

<a (click)="doSwitch()">Switch</a>
<ng-container *ngComponentOutlet="component1"></ng-container>
<ng-container *ngComponentOutlet="component2"></ng-container>

打字稿中的

：

Input()
component1: Type<any>;

Input()
component2: Type<any>;

...

使用组件时：

<switch-component [component1]="comp1" [component2]="comp2"></switch-component>

comp1: Type = ParentComponent1;
comp2: Type = ParentComponent2;