javascript - 如何在 Angular Material 动画之后执行代码

Question

我正在使用 Angular Material在一个网站上。作为响应式框架，它处理不同窗口大小的渲染。改变窗口大小时，添加一些布局变化和控件移动的动画

示例:https://material.angularjs.org/latest/demo/gridList (打开链接并调整窗口大小)

我在示例中显示的图 block 上有一些 WebGL Canvas ，需要在动画完成后重新绘制(并且容器具有最终尺寸)。

如何获得一些 回调 或 promise 以完成 UI 动画？

Answer 1

此问题的解决方案是将属性 md-on-layout 添加到 md-grid-list ( docs )。

例子:

HTML:

<md-grid-list md-on-layout="update($event)" ...>
  <md-grid-tile>...</md-grid-tile>
</md-grid-list>

Controller :

$scope.update = function($event){
    console.log("Updating layout."); 
}