使用 socket.io 更新 Angular 工厂中的计数器

Question

我正在尝试实现自动更新（增加）传入数据数量的解决方案。

我正在监听传入的消息并在工厂中计算它们：

angular.module('app')
    .factory('UpdateCounter', ['socketio', function (socketio) {
        var counter = { count: 0 };

        socketio.on('message', function (msg) {
            counter.count += 1;
            console.log(counter);
        });
        return counter;
}]);

我在控制器中使用此服务：

angular.module('app')
    .controller('CounterCtrl', ['$scope', 'UpdateCounter',  
        function($scope, UpdateCounter) {
            $scope.counter = UpdateCounter;
    }]);

显示越来越多的数据：

<div class="text-center" ng-controller="CounterCtrl">
 <h3 count-to="{{counter}}" value="{{countFrom}}" duration="4" class="total-events"></h3>
</div>

在日志中我可以看到消息数量在增加，但我在前端看不到增加（它始终为 0）

我正在使用 angular-count-to 制作数数动画

Answer 1

我认为您遗漏了 $scope.countFrom 并且看起来 $scope.counter 将成为一个对象。不需要将数字传递到 count-to 属性吗？

更新

我刚刚注意到的其他事情：您从未在 angular 模块声明中包含 count-to 指令。试着让它更像这样：

var app = angular.module('app', ['count-to']);
app.factory(.....);
app.controller(....);

使用 socket.io 更新 Angular 工厂中的计数器

Update Counter in Angular factory with socket.io

counter

socket.io

angularjs