javascript - AngularJS 1.5组件模板完全渲染后触发功能

Question

我正在使用 Angular 1.5 组件。

基本上我需要在模板完全渲染后触发一个函数。

Components layout

所有这些组件都位于父组件内。 组件 1 已进入 ng-repeat 内部，该 ng-repeat 填充了卡片，但我需要将组件 2 的高度设置为等于组件 1 的高度。

组件 1 包含动态数据，因此它可能会稍长或稍短，但我没有找到任何智能方法来检索 COMP 1 的完整高度。

编辑:

在 COMP 1 中，数据已由父组件加载，我在逐步填充组件的 ng-repeat 方面遇到了麻烦。

Answer 1

我认为你应该在父组件中拥有state属性并从子组件中更新它

function ParentComponentController () {

    var vm = this;

    vm.readyStatus = {
      Component1: false,
      Component2: false,
      // etc
    }

    vm.checkReadyStatus = function(){

       var isReady = true;

       for(status in vm.readyStatus) {
          if(status == false) {
              isReady = false;
          }
       }

       return isReady;

    }

    vm.resizeHeights = function() {

       if(vm.checkReadyStatus()) {
           // do resize
       }
    }
}

因此您需要将 vm.resizeHeights 传递给您的子组件

ChildComponent1 = {
   bindings: {
      resizeHeights: '&',
      readyStatus: '='
   },
   controller: function() {

       var vm = this;

       doAsyncRequest().then(function(){
            vm.readyStatus = true; 
            vm.resizeHeights() // so if template is ready, we execute resize  
       })

   }
}

希望对你有帮助