Javascript AngularJS:The；“最佳”；将工厂变量绑定到$scope或指令的方法？

我正在做一个新的AngularJS项目，遇到了一个让我非常恼火的问题

我有一个Angular服务，其中包含需要从多个视图和控制器访问的数据，并由另一个通过SocketIO从服务器接收连续数据的服务进行更新

比如：

angular.module('Foo', [])

.factory('DataContainer', function(){  
    var data = [];
    var o = {};
    o.all = function() {
        return data;
    };
    o.add = function(item){
        data.push(item);
    };
    return o; 
})

.factory('DataReceiver', function(DataContainer){
    var o = {}
    o.init = function(){
         socket = io.connect()
         .on('data', function(item){
              DataContainer.add(item);
         };
    };
   return o;
})

.directive('dataList', function(DataContainer) {
    return {
        restrict: 'E',
        template: '<ul><li ng-repeat="item in data">{{item}}</li></ul>',
        replace: true,
        link: function(scope) {
            scope.data = DataContainer.all();
        }
    };
});

认为它能解决我的问题。但事实并非如此

我现在正在考虑使用$rootScope，或$watch与$scope.apply（）组合来传递和更新我的数据，但这听起来相当沉重，我不确定这是正确的方式

我做错了什么？有没有合适的方法将服务变量绑定到控制器$scope或指令？

---

谢谢你的帮助

问题是您在

DataContainer

中没有

push

功能，但您试图在此处调用

.factory('DataReceiver', function(DataContainer){
    var o = {}
    o.init = function(){
         socket = io.connect()
         .on('data', function(item){
              DataContainer.push(item);
         };
    };
   return o;
})

---

您应该调用

DataContainer.data.push（item）

或在

DataContainer

服务中创建一个函数

push

，或者您应该调用

DataContainer.add（item）

问题是您在

DataContainer

中没有

push

函数，但您试图在此处调用

.factory('DataReceiver', function(DataContainer){
    var o = {}
    o.init = function(){
         socket = io.connect()
         .on('data', function(item){
              DataContainer.push(item);
         };
    };
   return o;
})

您应该调用

DataContainer.data.push（item）

或在

DataContainer

服务中创建一个函数

push

，或者您应该调用

DataContainer.add（item）

试试这个

.factory('DataReceiver', function(DataContainer, $rootScope){
    var o = {}
    o.init = function(){
         socket = io.connect()
         .on('data', function(item){
              DataContainer.add(item);
              $rootScope.$apply()
         };
    };
   return o;
})

试试这个

.factory('DataReceiver', function(DataContainer, $rootScope){
    var o = {}
    o.init = function(){
         socket = io.connect()
         .on('data', function(item){
              DataContainer.add(item);
              $rootScope.$apply()
         };
    };
   return o;
})

---

我认为您应该在

Datacontainer.add（）

中使用

$rootScope.$broadcast（）

方法。例如，

$rootScope.$broadcast（“datareceived”）Datacontainer.add（）

和directive.inject$rootScope中的code>并添加：

$rootScope.$on("datarecived",function(e,obj)
{
   scope.data = DataContainer.all();
})

---

我认为您应该在

Datacontainer.add（）

中使用

$rootScope.$broadcast（）

方法。例如，

$rootScope.$broadcast（“datareceived”）Datacontainer.add（）

和directive.inject$rootScope中的code>并添加：

$rootScope.$on("datarecived",function(e,obj)
{
   scope.data = DataContainer.all();
})

---

只需调用

Datacontainer.add（item）

Woops，这只是复制我的代码的一个错误。这实际上是我的观点：我正在从DataReceiver调用DataContainer.add（）（或任何其他推送、拼接、我的数据数组的方法），但如果我从指令或控制器本身调用此方法，它只会更新我的指令/控制器$scope。只需调用

DataContainer.add（item）

Woops，这是复制我的代码的一个错误。这实际上就是我的观点：我正在从DataReceiver调用DataContainer.add（）（或任何其他推送、拼接、我的数据数组的方法），但如果我从指令或控制器本身调用此方法，它只会更新我的指令/控制器$scope。