2016-11-15 3 views
3

Ожидается ли, что в случае загрузки динамических компонентов не будет вызван крюк жизненного цикла ngOnChanges? Для меня вызываются только конструкторы, ngOnInit и ngAfterViewInit. Однако согласно docs его следует вызывать перед ngOnInit.Угловая 2 Динамическая загрузка компонента ngOnChanges вызов вызова жизненного цикла

Я загрузка компоненты, как это:

@ViewChild('place', { read: ViewContainerRef }) container: ViewContainerRef; 

    private componentRef: ComponentRef<MyLoggerComponent>; 

    constructor(private componentFactoryResolver: ComponentFactoryResolver) { } 

    ngAfterViewInit() { 
    const componentFactory: ComponentFactory<any> = this.componentFactoryResolver.resolveComponentFactory(MyLoggerComponent); 
    this.componentRef = this.container.createComponent(componentFactory); 
    this.componentRef.changeDetectorRef.detectChanges(); 
    } 

Plunker

+0

ngOnChanges() вызывалась только когда угловые привязок входы обновления и динамические созданные компоненты не поддерживают @Input() или @output() – yurzui

+0

Обычный компонент будет срабатывать ngOnchange, если он имеет @Input porperty и он обновлен Этот плункер не будет работать http://plnkr.co/edit/w2Cc1ssw30ZcP0M2gFdJ?p=preview – yurzui

+0

Здесь работает плункер с регулярным компонентом http://plnkr.co/edit/sFl84z0XY6OpCa5imTvz?p=preview – yurzui

ответ

1

Согласно дискуссии https://github.com/angular/angular/issues/8903 динамических компонентов нагрузка не должен вызывать ngOnChanges в детском компоненте даже после вызова detectChanges, потому что это событие зарезервировано только для шаблона привязок.

Если ваш дочерний компонент загружен только динамическим способом, вы можете использовать установщик Javascript вместо ngOnChanges. Вот пример:

export class DynamicallyLoadedComponent { 
    private _property: string; 
    get property(): string { return this._property; } 
    set property(newVal: string) { 
    if (this._property === newVal) { return; } 
    this._property = newVal; 

    this.onChanges(); // instead of ngOnChanges 
    } 
} 
Смежные вопросы