Question

我在Angular JS中使用Factory，使用router-ui在2个控制器/子视图之间共享数据。

厂：

app.factory('SharedData', function() {
  return {data: {}};
})

JobsController：

app.controller("JobsController", function($scope, $http, $resource, $location, $stateParams, JobsService, $state, SharedData) {
  SharedData.data = JobsService.query();

  $scope.data = SharedData.data; 
});

NavController：

app.controller("navController", function($scope, $state, SharedData) {
  $scope.data = SharedData.data;
});

jobs.html

{{data.jobs.length}} // this updates fine

nav.html

{{data.jobs.length}} // this does not update

相反，我必须这样做：

NavController：

app.controller("navController", function($scope, $state, SharedData) {
  $scope.data = SharedData;
});

jobs.html

{{data.jobs.length}} // this works fine

nav.html

{{data.data.jobs.length}} // this now works but not sure why the extra 'data' is needed?

显然我在这里做错了什么但我无法弄清楚谷歌搜索了几个小时......有人可以帮忙吗？

Answer 1

这个怪癖与分配顺序有关。

初始化SharedData时，它是一个具有单个属性data的对象，它是一个空对象。

初始化navController时，$scope.data的设置等于空对象SharedData.data。

初始化jobsController时， 会用完全不同的对象替换 SharedData.data。在此之后，$scope.data设置为等于此新对象，但navController仍指向原始空对象。

在您的第二个示例中，navController并未指向即将被替换的此对象。相反，它指向SharedData对象本身，因此$scope.data.data将始终解析SharedData上当前存在的任何对象。

多视图不更新Angular JS中的变量

1 个答案: