angularJS $范围未被应用

时间:2015-02-12 20:19:43

标签: angularjs scope apply watch

我对angularJS很新,所以如果我说完全错了,请原谅我。我做了一些聊天。获取数据后,我的示波器/视图没有更新问题。我有一个变量$ scope.users,这是一个包含用户信息的数组,视图对用户进行ng-repeat以显示其信息。 数据存储在上一页中,并通过会话存储加载。 控制器看起来像:

app.controller('table-controller',['$scope','$interval','HttpService','TableModel',
function($scope,$interval,HttpService,TableModel){
    var _this = this;
    console.log('loading table controller ...');


    $scope.users = [];
    var sessionData = JSON.parse(sessionStorage.getItem('sessionData'));
    var activeUsers = sessionData.activeUsers;

    //$scope.users = TableModel.initUsers();

    $scope.$watch('users',function(){
        for(var i = 0; i < 10; i++){
            $scope.users.push({
                user : ' ',
                name : 'Vacant',
                picture : '../img/sit_default.png',
                speak_turn : ' ',
                sit : i,
                last_request : 0
            });
        }
        for(var i = 0; i < activeUsers.length; i++){
            var sit  = activeUsers[i].sit;
            $scope.users[sit] = activeUsers[i];
        }   
    });
$scope.className = function(index){
        return "sit" + (index + 1);
    }

html是:

 <ul class="first-place">
        <li ng-repeat="user in users track by $index" ng-class="className($index)">
          <div class="pro_pic_wrap">
            <img ng-src="{{user.picture}}" alt="">
            <span>{{$index + 1}}</span>
          </div>
          <a href="#">{{user.name}}</a>
        </li>  
 </ul>

如果我使用$ watch创建$ scope.users,一切正常。否则,当页面加载视图时,会看到一个空的$ scope.users,因此ng-repeat不执行任何操作。如果我重新加载页面一切正常。我尝试了$ scope。$ apply()但是给了我一个错误,说已经调用了摘要。我不明白为什么我需要在这里使用$ watch。 在此先感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

你可以创建一个方法并调用它而不是使用$ watch

$scope.getUsers= function(){
    for(var i = 0; i < 10; i++){
            $scope.users.push({
                user : ' ',
                name : 'Vacant',
                picture : '../img/sit_default.png',
                speak_turn : ' ',
                sit : i,
                last_request : 0
            });
        }

        for(var x = 0; x < users.length; x++){
            var sit  = activeUsers[x].sit;
            $scope.users[sit] = activeUsers[x];
        }   
}
$scope.getUsers();