如何通过angularjs填充元素的高度?

zlo*_*log 3 javascript jquery http angularjs

我正在做一个$http.get获取json数据,然后用于用类似的东西填充视图

$scope.getIdeas = function() {
  $http.get(ideasUrl)
    .success(function(data) {
      $scope.ideas = data;
      console.log($(".ideas-list").height()); // No height yet =(
    })
};
Run Code Online (Sandbox Code Playgroud)

然后填充视图

<ul ng-cloak class="ideas-list" ng-init="getIdeas()">
  <li class="idea"
    ng-repeat="idea in ideas"
    >{{idea.text}}</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

但是,在success通话中,.ideas-list还没有高度.我在哪里可以获得填充的视图高度?我可以参加一个活动吗?

joa*_*mbl 7

使用setTimeout(或最好是$timeout服务),以便Angular可以在检查高度之前更改dom:

$scope.getIdeas = function() {
  $http.get(ideasUrl)
    .success(function(data) {
      $scope.ideas = data;
      $timeout(function(){
        console.log($(".ideas-list").height());
      });
  })
};
Run Code Online (Sandbox Code Playgroud)

  • 当您向$ scope添加数据时,在Angular检测到此更改并重建dom之前,dom不会更新.由于成功回调包含在`$ apply`中,因此更改将在同一执行线程中发生.这就是为什么你可以添加一个没有延迟的`setTimeout`的原因(就像你告诉程序完成它将要完成的所有事情,然后执行超时回调函数). (2认同)