通过 ComponentFactoryResolver 创建组件时更改检测不起作用

Jus*_*s10 6 components input angular2-directives angular

我有一个组件,使用 ComponentFactoryResolver 创建另一个组件。似乎工作正常,我可以通过@Input 访问数据。问题是 ngOnChanges 在组件启动或数据更改时永远不会被调用。但是,如果我使用 HTML 中的选择器以正常方式创建组件,它确实会触发。但这不是动态的,所以我只剩下 ComponentFactoryResolver。这是正常行为吗?

我的父组件有它的输入:

@ViewChild( MyDirective ) myHost: MyDirective;

然后它创建子组件,其输入是这样的:

@Input('key') key: String;
@Input('index') index: number;
Run Code Online (Sandbox Code Playgroud)

我正在创建这样的组件:

let item = new Item(ItemDropdownComponent, this.key, 0);
let componentFactory = this._componentFactoryResolver.resolveComponentFactory(item.component);
let viewContainerRef = this.myHost.viewContainerRef;
viewContainerRef.clear();
let componentRef = viewContainerRef.createComponent(componentFactory);
(<ItemInterfaceComponent>componentRef.instance).key = item.key;
(<ItemInterfaceComponent>componentRef.instance).index = item.index;
Run Code Online (Sandbox Code Playgroud)

Gün*_*uer 7

这是预期的行为。您可以显式调用更改检测

componentRef.changeDetectorRef.detectChanges();
Run Code Online (Sandbox Code Playgroud)

  • 它将为视图绑定运行更改检测,但不会为输入运行。`ngOnChange` 仅在输入绑定更新时调用,但动态添加的组件没有输入绑定。你可以将 `ngOnChanges()` 中的代码移动到另一个方法并从 `ngOnChanges()` 中调用它,这样它就会在你“以正常方式”使用你的组件时执行,或者像 `componentRef.instance.foo 这样调用这个方法()` 如果您动态添加组件。你也可以调用`componentRef.instance.ngOnChanges()`。 (3认同)