Question

如何以角度4将一个动态组件注入另一个组件，以及如何将值从父组件传递给子组件。任何人都可以帮助使用示例工作代码。

Answer 1

这个问题有点不清楚，并且肯定会因为你所尝试的内容缺乏任何示例代码而得到投票，而且缺乏关于你想要完成什么的详细信息。

基本上，组件可以包含在另一个组件中，使用选择器作为HTML元素，如下所示：

在父组件中：

<div>
   <ai-star [rating]='product.starRating'
            (ratingClicked)='onRatingClicked($event)'>
   </ai-star>
</div>

子组件：

@Component({
    selector: 'ai-star',
    templateUrl: 'app/shared/star.component.html',
    styleUrls: ['app/shared/star.component.css']
})
export class StarComponent implements OnChanges { ... }

您可以在此处找到完整的示例代码：https://github.com/DeborahK/Angular2-GettingStarted

Answer 2

动态注入组件，请参见代码 here ，我们必须使用 ComponentFactoryResolver

let adItem = this.user;
    let componentFactory = this.componentFactoryResolver.resolveComponentFactory(adItem.component);
    let viewContainerRef = this.injectHost.viewContainerRef;
    viewContainerRef.clear();
    let componentRef = viewContainerRef.createComponent(componentFactory);
    (<InjectComponent>componentRef.instance).data = adItem.data;

Angular中的动态注入，将组件注入父组件

2 个答案: