Angularjs:在 Controller 之间共享可观察数据

Question

我需要在多个 Controller 中使用数据上下文。
数据上下文可以以不同的方式更改(通过 ajax 调用、通过用户/ View 、通过服务器)。
当数据上下文中的数据发生变化时，应通知所有使用数据上下文的 Controller 。

数据上下文:

var userDataContext = { firstName: "John", lastName: "Doe" };

我在每个示例中都使用 setTimeout 模拟了后端更改

setTimeout(function() {
    console.log("change firstname");
    userContext.firstName= "Bart";
}, 3000);

这是 Knockout 中的一个 fiddle 示例，它工作正常。
http://jsfiddle.net/8ct0L1zu/4/

我也尝试用 Angular 来做，但它部分工作。

当我将完整的对象传递给 Controller ​​(通过引用)时， Controller 之间会发生变化。
在 javascript/后端更改数据上下文时，它不会改变我的观点。

我也更喜欢在 Controller 范围内只有名字和姓氏，而不是完整的对象。但在这种情况下，没有任何作用。
原因:在我们的应用程序中，会有很多带有大对象数组的数据上下文。

http://jsfiddle.net/19xv3skn/1/

为了真正让它发挥作用，我使用了带有淘汰赛的 Angular。用于数据绑定(bind)的 Angular 和用于数据上下文的淘汰赛。这很好用，但我不太喜欢这个解决方案。
http://jsfiddle.net/7chp5xLa/2/

是否有最佳实践或更好的方法来处理 Angular 中的可观察数据上下文？

Answer 1

我认为问题可能出在您考虑在 AngularJS 应用程序中管理数据的方式上。您正在 AngularJS 生命周期之外编辑 userContext 数据。您无需管理 AngularJS 所看到的内容，而是在将数据提供给 AngularJS 之后对其进行编辑。相反，请考虑从 Angular 中更改 userContext 状态，在您需要的地方

在您的示例中，您有两个 Controller 在 $scope 上具有相同的数据，也许您应该引用一个通用的父 Controller 来管理 $scope 的数据:

jsfiddle

app.controller('ParentCtrl', function ($scope, userContext, $timeout) {
   $scope.firstName = userContext.firstName;
   $scope.lastName = userContext.lastName;
   $scope.user = userContext;
   $timeout(function() {
       console.log("change firstname");
       userContext.firstName= "Bart";
   }, 3000);
});

当您想对每个 Controller 的 userContext 执行不同的操作时，事情会变得更加有趣。在这种情况下，您可能需要根据您的需要在 Controller 之间进行一些同步。关于 Controller 之间共享状态和 Controller 之间通信的问题有很多答案。