動態組件的角度2 OnPush變化檢測

我有一個Angular組件，它可以動態地在其內部創建各種其他類型的組件。它通過OnChanges鉤子將其自己的屬性綁定到子組件@Input屬性。動態組件的角度2 OnPush變化檢測

當該子組件的更改檢測設置爲默認時，此綁定正常工作。然後檢測新的輸入並更新組件模板。

但是，如果更改檢測爲OnPush，則不起作用，則檢測不到更改。我相信應該檢測到更改，因爲將新的不可變對象（字符串）分配給組件@Input屬性。

這裏有一個plunker證明： https://plnkr.co/edit/0wHQghtww2HXVbC27bC1

我怎樣才能得到這個家長對動態子屬性綁定與ChangeDetectionStrategy.OnPush工作？

來源

2017-01-23 Chris Fulstow

任何有興趣，以下是相關的GitHub問題，以及更多關於爲什麼OnPush變化檢測對動態組件有不同作用的相關GitHub問題 - https： //github.com/angular/angular/issues/14087 –

作爲可能的解決方法OnPush部件將被一起使用設定器與cdRef.markForCheck()：

變化檢測用onpush.component.ts

@Component({ 
    selector: 'app-change-detection-onpush', 
    template: ` 
    <div> 
     ChangeDetectionStrategy.OnPush: {{ message || '[blank]' }} 
    </div>`, 
    changeDetection: ChangeDetectionStrategy.OnPush 
}) 
export class ChangeDetectionOnPushComponent implements IMyComponent { 
    private _message: string; 

    constructor(private cdRef: ChangeDetectorRef) {} 

    set message(val: string) { 
    this.cdRef.markForCheck(); 
    this._message = val; 
    } 

    get message() { 
    return this._message; 
    } 
}

Modified Plunker

來源

2017-01-23 06:36:56 yurzui

偉大的解決方案，謝謝@yurzui –

動態組件的角度2 OnPush變化檢測

回答

相關問題