如何在控制器和指令之间共享服务动态数据

我想知道使用哪种模式，如果我需要我的服务在控制器，指令等之间共享动态数据。我提到动态的原因是因为我' d需要加载新数据，并且此数据需要在任何其他控制器，指令等中可用。例如，如果指令生成UL LI，则如果服务内部的数据已更改，则它必须重新生成它！如何在控制器和指令之间共享服务动态数据

我最初打开了以下内容（How to create reset() method in Service that return promise?），有人指出我应该使用观察者模式。这我很感激，我很快就写了这是什么，我需要做的，尖峰意见将非常感谢（http://jsbin.com/epAMaP/1）

var MyApp = angular.module('MyApp', []); 

MyApp.config(function($locationProvider){ 

    $locationProvider.hashPrefix('!'); 

}); 

MyApp.factory('MyService', function($timeout){ 

    var data; 

    var loadData = function(){ 

     data = { 
      foo: "bar", 
      time: new Date() 
     }; 

     return data; 

    }; 

    return { 

     refresh: function(){ 

      loadData(); 

     }, 

     getData: function(){ 

      return loadData(); 

     } 

    }; 

}); 

MyApp.controller('MyCtrl', function($scope,MyService,$timeout){ 

    $scope.foo = "Service share data"; 

    $scope.data = MyService.getData(); 

    $scope.$on("eventFoo", function(){ 
    console.log("Data has changed!"); 
    console.log($scope.data); 
    }); 

    $timeout(function(){ 
    MyService.refresh(); 
    $scope.$apply(function(){ 
     $scope.data = MyService.getData(); 

     $scope.$emit("eventFoo"); 
    }); 
    }, 3000); 

}); 

MyApp.directive('myDirective', function(MyService,$timeout){ 

    return { 
     restrict: 'A', 
     link: function(scope, elem, attrs){ 
      scope.$on("eventFoo", function(){ 
       console.log("Event foo triggered!"); 

       scope.data = MyService.getData(); 

       console.log(scope.data); 
      }); 
     } 
    }; 

});

我认为这将解决我的大部分问题，但有件事情，我需要记住。我将加载的数据来自$ http GET，所以我认为每次需要更新或加载数据时都需要使用至少一个承诺，然后触发正确的事件。

我对AngularJs的经验不足导致我质疑自己的想法，因此非常感谢任何帮助或建议！

感谢您的期待！

来源

2013-10-02 punkbit

我想我找到了一个可能的答案，用承诺和观察者模式（如果这是正确的，说明我在做什么）：

var MyApp = angular.module('MyApp', []); 

MyApp.config(function($locationProvider){ 

    $locationProvider.hashPrefix('!'); 

}); 

MyApp.factory('MyService', function($q,$timeout,$rootScope){ 

    var deferred; 
    var data; 

    var loadData = function(){ 

     data = { 
      foo: "bar" + Math.floor((Math.random()*100)+1), 
      time: new Date() 
     }; 

     deferred.resolve(data); 

    }; 

    return { 

     getPromise: function(){ 

      deferred = $q.defer(); 
      loadData(); 

      return deferred.promise; 

     }, 

     getData: function(){ 

      return data; 

     } 

    }; 

}); 

MyApp.controller('MyCtrl', function($scope,MyService,$timeout){ 

    $scope.foo = "Service share data"; 

    MyService.getPromise().then(function(data){ 
    $scope.data = data; 
    console.log("Initial data request:"); 
    console.log($scope.data); 
    $scope.$emit("eventFoo"); 
    }); 

    // then after awhile a user requests updated data 
    $timeout(function(){ 

    console.log("// then after awhile a user requests updated data"); 

    $scope.$apply(function(){ 

     MyService.getPromise().then(function(data){ 

      $scope.data = MyService.getData(); 
      $scope.$emit("eventFoo"); 

     });   

    }); 
    }, 3000); 

}); 

MyApp.directive('myDirective', function(MyService,$timeout){ 

    return { 
     restrict: 'A', 
     link: function(scope, elem, attrs){ 
      scope.$on("eventFoo", function(){ 
       console.log("Event foo triggered!"); 

       scope.data = MyService.getData(); 

       console.log(scope.data); 
      }); 
     } 
    }; 

});

你可以找到的代码住在http://jsbin.com/ahiYiBu/1/

任何提示或建议都非常感激，

非常感谢您的时间:)

来源

2013-10-02 01:56:50 punkbit

我不知道如果这有助于但是我recentl Ÿ使用

$rootScope.$broadcast火灾和 $scope.$on赶上变化

据我可以告诉它棱角分明的实现观察者模式的共享两个控制器和服务之间的数据

来源

2013-10-15 12:49:48

如何在控制器和指令之间共享服务动态数据

回答

相关问题