javascript - AngularJS $scope 没有在 DOM 中更新

Question

我有以下代码：

状态（为了简单起见，让我们简称）

.state('foo', {
    url: '/foo',
    templateUrl: 'path/to/template.html',
    controller:'fooCtrl',
})

控制器

controller = function($scope){
    // not the actual code
    $scope.barCount
}

模板.html

<div>
    <span>{{ barCount }}</span> // this is updating properly
</div>

其他 html 部分

<div ng-controller="fooCtrl">
    <span>{{ barCount }}</span> // this is **NOT** updating properly
</div>

我的控制器上有一个scope变量。2 路绑定在与控制器一起声明的模板上运行良好。但不是在我使用.stateng-controller

这是某种错误吗？还是我错过了什么？谢谢。

Answer 1

您有一个控制器，但该控制器有两个实例。每次您使用 ng-controller 或在不同的视图中声明它时，都会创建一个新实例，因此所有控制器都在不同的范围内。在控制器之间共享数据的最佳方式是服务，因为它们是单例的，所以它们只有一个实例。例子：

angular.module('app')

.factory('fooService', [function(){
  var bar = 'Shared Data';
  return {
    getBar: function(){
      return bar;
    }
  };
}])

.controller('FooController', ['fooService', function(fooService){
  this.barCount = fooService.getBar();
  // or use $scope.barCount = fooService.getBar();
}];