Question

我的控制器上有这个代码：

angular.module('chatApp').
controller('MainUserList', ['$scope', '$state', '$http', 'AppData', '$localStorage', function ($scope, $state, $http, AppData, $localStorage) {
    var socket = AppData.getSocket();
    $http.get('http://localhost:3000/api/users').success(function(data){
        $scope.users = data;
    });  
    socket.on('X_USER_LOGIN', function(data){
        for(var x=0;x<$scope.users.length;x++){
            if($scope.users[x].id === data.id){
                console.log('doufn!');
                delete $scope.users[x];
                break;
            }
        }
    });
    socket.on('X_USER_LOGOUT',function(data){
        console.log(data.id+' has logged out!');
    });


    $scope.excludeUser = function(object){
        return object.id !== $localStorage.clientProfile.id;
    };
}]);

然而，当事件X_USER_LOGIN被触发时，控制台显示我想要的字符串，但视图上的列表没有更新。从上面的代码中，应该删除数组成员吗？

以下是我的部分观点：

<div class="panel widget-messages-alt">
<div class="panel-body">
    <div class="messages-list">
        <div class="message" ng-repeat="usr in users| filter:excludeUser">
            <img src="./images/avatar1.png" alt="" class="message-avatar">
            <a href="#" class="message-subject"><i class="fa" ng-class="usr.online===1?'fa-circle text-success':'fa-circle-o'"></i> {{usr.firstname + ' ' + usr.lastname}} ({{usr.username}})</a>
            <div class="message-description"> Sample last message
            </div> <!-- / .message-description -->
        </div> <!-- / .message -->
    </div> <!-- / .messages-list -->
</div> <!-- / .panel-body -->

我做错了吗？

Answer 1

好的，我有答案。

由于我使用的是socket.IO的函数，我必须将数据删除包装在$scope.apply函数

上

工作代码：

angular.module('chatApp').
controller('MainUserList', ['$scope', '$state', '$http', 'AppData', '$localStorage', function ($scope, $state, $http, AppData, $localStorage) {
    var socket = AppData.getSocket();
    $http.get('http://localhost:3000/api/users').success(function(data){
        $scope.users = data;
    });  
    socket.on('X_USER_LOGIN', function(data){
        for(var x=0;x<$scope.users.length;x++){
            if($scope.users[x].id === data.id){
                console.log('doufn!');
                /*change is here*/
                $scope.$apply(function(){
                   delete $scope.users[x];
                });
                break;
            }
        }
    });
    socket.on('X_USER_LOGOUT',function(data){
        console.log(data.id+' has logged out!');
    });


    $scope.excludeUser = function(object){
        return object.id !== $localStorage.clientProfile.id;
    };
}]);

angularjs视图不更新数据更改

1 个答案: