Angular 2 ngFor Update查看生命週期鉤子

我希望在更新通過* ngFor綁定到模板html的值數組之後觸發動畫。Angular 2 ngFor Update查看生命週期鉤子

對於我的動畫有意義，我需要在視圖更新最新值後觸發它。

我想知道在視圖完成更新時我能夠掛鉤的生命週期中是否有一個點？或者，如果我可以調用某些東西來觸發視圖以立即使用最新值更新？

來源

2016-03-08 one8t

我想知道在視圖完成更新時我是否可以掛入生命週期中的某個點？

您可以通過指令環繞ngFor中的每個元素。該指令只能在第一次渲染時執行動畫。

來源

2016-03-08 00:36:06 basarat

感謝您的迅速回復！當視圖完成更新'ngFor'中的子元素時，我實際上需要觸發父級（父級的父級）的動畫。 – one8t

您可以從指令元素的'parentNode'中獲取父項 – basarat

animations: [ 
    trigger('fadeInOutTranslate', [ 
     transition(':enter', [ 
     style({opacity:0}), 
     animate(300, style({opacity:1})) 
     ]), 
     transition(':leave', [ 
     style({transform: 'translate(0)'}), 
     animate(300, style({opacity:0})) 
     ]) 
    ]) 
    ],

我沒有測試它，但它適用於* ngIf，所以爲什麼不用* ngFor，也許你可能會找到你的角度動畫屬性。

https://angular.io/docs/ts/latest/guide/animations.html

來源

2017-01-23 10:28:16

Angular 2 ngFor Update查看生命週期鉤子

回答

相關問題