角2アニメーションコールバック.done、プロパティを設定しますか？

Question

は、我々が持っているとしましょう： <li *ngFor="let item of items" [@myTrigger]='state' (@myTrigger.start)="animStart($event)" (@myTrigger.done)="animDone($event)">{{ item }}</li>

そしてメソッドanimDone：私はにconsole.logは（ '！エンド'）適切に発射しながら奇妙何{{ animDetails }}

が持っているビューで

animDetails: string; 

animDone(event:any) { 
    console.log('Ended!'); 
    this.animDetails = 'I am done!'; 
} 

、 animDetailsはありません。

最初のアニメーションは何も変更されません。第2のアニメーション（ボタンをクリックすることによって開始される）は、「完了です！」 .doneとは対照的に、開始時に直ちに発火する。

Answer 1

AFAIKアニメーションはパフォーマンスの理由からAngularsゾーン外で実行されます。

constructor(private cdRef:ChangeDetectorRef) {} 

animDetails: string; 

animDone(event:any) { 
    console.log('Ended!'); 
    this.animDetails = 'I am done!'; 
    this.cdRef.detectChanges(); 
} 

Angularsゾーン内でアニメーションコールバックを実行する際に問題が発生しました。私はそれがすでに修正されていると仮定しますが、最新のAngular2バージョンを使用していない場合を除いて、あなたの質問はそうでないと思われます。