2016-06-22 7 views
3

私はRC1からRC2に更新し、この謎めいたメッセージを受け取りました - 「式が確認された後に変更されました」コードは非常に簡単です。
親コンポーネントには2つの子「姉妹」と「兄弟」があります。 initの直後に、姉妹は親の変数に割り当てられたイベントを送出し、兄のInput()プロパティは同じ変数にバインドされます。私はこれが親の変数を使った兄弟コンポーネント間の "古典的な"通信だと思う。
これはRC1では動作していましたが、RC2では動作しませんでした。私はCHANGELOG.mdをチェックしましたが、ヒントは見つかりませんでした。私は間違って何をしていますか? http://plnkr.co/edit/HMPAbImpWWeZrVjHyb6H?p=previewAngular2 RC2式がチェックされた後に変更されました。

import { Component, Input, Output, EventEmitter } from '@angular/core'; 

@Component({ 
     selector: 'brother', 
     template:'<h2>Brother has {{present}}</h2>' 
}) 
export class Brother{ 
    @Input() present: string; 
} 

@Component({ 
    selector: 'sister', 
    template:'<h2>Sister has {{_present}}</h2>' 
}) 
export class Sister{ 
    @Output() present: EventEmitter<string> = new EventEmitter; 
    public _present: string = 'something'; 
    ngOnInit(){ 
    this.present.emit(this._present); 
    } 
} 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div class="container"> 
     <h2>Parent has {{present}}</h2> 
     <brother [present]="present"></brother> 
     <sister (present)="present=$event"></sister> 
    </div> 
    `, 
    directives:[Brother,Sister] 
}) 
export class AppComponent { 
    public present: string; 
} 

答えて

7

はい、少し変更されました。具体的に

修正(ファサード):に

@Output() present: EventEmitter<string> = new EventEmitter; 

:あなたからあなたのコードを変更するのであれば(#8761)はデフォルトで同期されるように

https://github.com/angular/angular/commit/e5904f4

を持つEventEmitterを変更:

@Output() present: EventEmitter<string> = new EventEmitter(true); 

これでうまくいくはずです。同じ動作になります。

は、私は、コードを単純化しましたhttps://github.com/angular/angular/blob/master/modules/%40angular/facade/src/async.ts#L152

http://www.bennadel.com/blog/3071-synchronous-vs-asynchronous-eventemitters-in-angular-2-beta-14.htm

+0

マジック。私の問題は消え去る。あなたは、同期/非同期などに関するいくつかの情報を私に教えてください。 –

1

角度は上から下へ、弟が最初にチェックされ、姉が二チェックされているテンプレートを処理しています。姉妹は同期イベントを発生させ、兄弟フィールドが変更された直後にそれを変更します(兄弟)。 Angularは、デバッグモードでこの種のエラーを検出します。このモードでは、次の検出器がパスするまで、この変更は検出されずに残されます(テンプレートは更新されません)。アプリテンプレートのコンポーネントの順序を変更すると、エラーは消えます。

<sister (present)="present=$event"></sister> 
    <brother [present]="present"></brother> 
+0

も参照してください。姉妹と兄弟は対称です。同時に、両者は最初の場所になければなりません。これは不可能と思われる。あなたの回避策は動作します!あなたの時間をありがとう。 –

+0

受諾された回答が問題を解決しました(コンポーネントの順序を変更できません)。私は何が起こっているのかを理解していたので投票しました。 – Stephen

関連する問題