Question

我的状态可以有一个可变的高度（取决于内容）。我想将该高度设置为背景颜色的css属性。

但是我无法获得正确的高度，因为代码会在内容加载到状态之前触发。

我有这个状态，

$stateProvider
  .state('home.suggestions', {
    url: '',
    views: {
      "suggestions": {
        templateUrl: '../assets/angular-app/templates/_suggestions.html',
        controller: function(){
          showHeight = $('.suggestions-container-wrapper').outerHeight();
          console.log(showHeight)
        }
      },

    },
  })

但它总是返回175（元素加载ng-repeat内容之前的高度。

如何在完成所有调用后运行代码？

Answer 1

刚刚找到一个简单的解决方案。但是在ng-repeat元素之后是ng-init，然后它会在触发时触发该函数。

https://stackoverflow.com/a/24817862/848706

%div{"ng-init" => "setHeight()"}

控制器，

$scope.setHeight = function (){
  $timeout(function(){
      showHeight = $('.suggestions-container-wrapper').outerHeight();
      console.log(showHeight)
    }, 0);

}

Answer 2

查看$viewContentLoaded上的文档。你可以做到：

controller: function(){
    $scope.$on('$viewContentLoaded', function(){
        showHeight = $('.suggestions-container-wrapper').outerHeight();
        console.log(showHeight)
    });
}

Here也是另一篇讨论它的帖子。

在ui-view中获取元素的高度

2 个答案: