AngularJS:如何在设置了$scope.var之后才在视图中设置$scope.var

AngularJS: How to set $scope.var in a view only after the $scope.var is set?

本文关键字:设置 scope var 视图 之后 AngularJS      更新时间:2024-03-13

我的角度中有一个视图,看起来像这样:

<li ng-repeat="n in range(newsList.length)" ng-class="{active: n == paging}" ng-click="setPage()">
                    <a href ng-bind="n + 1">1</a>
                </li>

现在问题出在newsList中,只有在发送$http请求并接收到响应之后才设置该范围。像这样:

$http.get('news/listings/' + ($scope.currentPage*$scope.itemsPerPage) + '/' + (($scope.currentPage+1)*$scope.itemsPerPage)).success (response) ->
    $scope.newsList = response

真正的问题是,在设置$scope.newsList之前,视图首先渲染,视图中的变量是undefined。如何告诉视图我只想在设置了$scope.newsList之后渲染那些li

顺便说一下,我在生成视图的控制器中调用$http请求。

编辑在我的控制器中,如果我输出$scope.newsList值,就会发生这种情况

$http.get('news/listings/' + ($scope.currentPage*$scope.itemsPerPage) + '/' + (($scope.currentPage+1)*$scope.itemsPerPage)).success (response) ->
        $scope.newsList = response
        alert $scope.newsList //returns object, which I want
alert $scope.newsList //undefined

再次编辑

解决了我的问题,但提出了另一个问题(以及这个问题的解决方案):此处

用空数组初始化$scope.newsList

$scope.newList = [];
$http.get(...

或者在您的视图中使用ngIf

<ul ng-if="newsList.length">
  <li 
    ng-repeat="n in range(newsList.length)" 
    ng-class="{active: n == paging}" 
    ng-click="setPage()"
  >
    <a href ng-bind="n + 1">1</a>
  </li>
</ul>

$resource服务具有isArray配置,使其在获取数据之前返回一个空数组。你能试试这个选项吗?我现在找不到任何文件。

$http.get(url, {isArray : true }).success(someCallback);