Question

我正在玩AngularJS。我想从服务中返回一个变量，该变量将让范围知道它何时发生变化。

为了说明这一点，请查看www.angularjs.org上的示例，“连接后端”。粗略地说，我们可以看到以下内容：

var projects = $firebase(new Firebase("http://projects.firebase.io"));
$scope.projects = projects;

在此之后，对projects对象所做的所有更新（通过更新，无论是本地还是远程）都将自动反映在范围绑定的视图上。

我如何在项目中实现同样的目标？就我而言，我想从服务中返回一个“自我更新”变量。

var inbox = inboxService.inboxForUser("fred");
$scope.inbox = inbox;

哪些机制让$scope知道它应该更新？

修改针对这些建议，我尝试了一个基本的例子。我的控制器：

$scope.auto = {
    value: 0
};

setInterval(function () {
    $scope.auto.value += 1;
    console.log($scope.auto.value);
}, 1000);

而且，在我看来的某个地方：

<span>{{auto.value}}</span>

尽管如此，它只显示0.我做错了什么？

Answer 1

更新

我制作了一个演示插件：http://plnkr.co/edit/dmu5ucEztpfFwsletrYW?p=preview
我使用$timeout伪造更新。

诀窍是使用普通的javascript引用：

您需要将对象传递给范围。
您不能覆盖该对象，只需更新或扩展它。
如果你覆盖它，你将失去＆＃34;绑定＆＃34;。
如果您使用$http，则会为您触发摘要。
因此，每当发生更改时，范围变量引用在服务中更新的同一对象，并且将通过摘要通知所有观察者。
AFAIK，那是$firebase＆amp; Restangular工作。
如果您进行多项更新，则需要重置属性。
由于您跨应用程序持有对象的引用，因此您需要了解内存泄漏。

例如：

<强>服务

app.factory('inboxService', function($http){

  return {
    inboxForUser: function(user){

      var inbox = {};

      $http.get('/api/user/' + user).then(function(response){
        angular.extend(inbox, response.data);
      })

      return inbox; 
    }
  };
});

<强>控制器：

app.controller('ctrl', function(inboxService){
  $scope.inbox = inboxService.inboxForUser("fred");
});

Answer 2

这取决于对象的更新方式。如果它在角度内“更新”，则会触发摘要周期（请参阅http://docs.angularjs.org/guide/scope），视图将自动更新。这就是Angular的美丽。

如果对象在角度（例如jQuery插件）的“外部”更新，那么您可以通过在$apply函数中包装正在进行更新的代码来手动触发摘要周期。像这样：

$scope.$apply(function() {
    //my non angular code
});

有关详细信息，请参阅http://docs.angularjs.org/api/ng.$rootScope.Scope。

在angularjs中自动更新范围变量

2 个答案:

更新

例如：