Angular：观察数据变化服务？

Question

我有一个定义为这样的服务：

appServices.service('SharedData', function() {
    var data = {};

    function setContacts(contacts) {
        data.contacts = contacts;
    };

    function getContacts() {
        return data.contacts;
    };

    return {
        setContacts: setContacts,
        getContacts: getContacts
    };
});

在另一个控制器中，我按如下方式访问数据：

$scope.contacts = SharedData.getContacts();

这一切都很好 - 但我希望每当SharedData中的数据发生变化时，都会提示$scope.contacts并更新它的数据。

我该如何做到这一点？

Answer 1

尝试明确的观察：

$scope.$watch(function() { return SharedData.getContacts(); }, function(newContacts) { // Do something with newContacts. });

如果集合的元素可以在没有整个集合对象改变标识的情况下改变（我假设是一个Array或Object ），那么你需要使用$scope.$watchCollection ，虽然这比普通的$watch要慢得多，所以如果可以，请避免立即改变整个集合。

请注意，将函数公开到仅返回当前联系人的范围可能是更好的设计：

$scope.getContacts = function() { return SharedData.getContacts(); };

如果您需要在SharedData通知，可以将$rootScope注入其中并将$watch置于其中。

Answer 2

警惕滥用它，但这只是$rootScope的用途：

appServices.service('SharedData', function($rootScope) {
  var data = {};
  function setContacts(contacts) {
    data.contacts = contacts;
    $rootScope.$broadcast('contacts-changed', contacts);
  };
  ...

现在，在您想要的任何范围内，您都可以注册此活动：

function($scope) {
  $scope.$on('contacts-changed', function(eventObj) {...});
}

Answer 3

一种方法是在服务中定义一个函数，它允许您在调用setContacts时注册要调用的回调（下面的onContactsUpdated ）。 这个解决方案并不完美（例如，它只允许您注册一个“处理程序”），但应该让您走上正确的轨道。 如果需要在多个地方使用它，你可以调整它。

appServices.service('SharedData', function() {
    var data = {};

    function setContacts(contacts) {
        data.contacts = contacts;
        if(typeof(data.contactsUpdatedCallback) !== "undefined"){
            data.contactsUpdatedCallback();
        }
    };

    function getContacts() {
        return data.contacts;
    };

    function onContactsUpdated(callback){
        data.contactsUpdatedCallback = callback;
    };

    return {
        setContacts: setContacts,
        getContacts: getContacts,
        onContactsUpdated: onContactsUpdated
    };
});

然后在你的控制器中：

SharedData.onContactsUpdated(function(){
    //do something with updated SharedData.getContacts()
});