如何在不同的页面控制器中访问更新的值?

时间:2015-06-29 09:45:23

标签: javascript angularjs angular-broadcast angularjs-rootscope

我遇到了在不同页面控制器之间获取更新值的问题,这是情况。

page1.html

<body ng-app="app">
<div  ng-controller="ctrl1">{{ version }}</div>
</body>

page2.html

<body ng-app="app">
<div  ng-controller="ctrl2">{{ version }}</div>
</body>

app.js

 var app = angular.module("app", []);

 app.run(function($rootScope) {
   $rootScope.Data = [];
   $rootScope.Data.Version = '1.0.0.1';
 });

  app.controller('ctrl1', function($scope, $rootScope){
   $scope.version = $rootScope.Data.Version;
   $rootScope.Data.Version = '1.0.0.2';
  });

 app.controller('ctrl2', function($scope, $rootScope){      
   $scope.version = $rootScope.Data.Version;
 });

结果

version: 1.0.0.1 // page1.html 
version: 1.0.0.1 // page2.html 

预期结果

version: 1.0.0.1 // page1.html 
version: 1.0.0.2 // page2.html 

如何实现这种情况?

我尝试使用本教程中的$broadcast来分隔页面控制器:fiddle

3 个答案:

答案 0 :(得分:3)

您不能在不丢失所有数据的情况下重新加载页面,您知道吗?你的$rootScope死了,一切都死了...... :)你的例子是完全错误的。 使用SPA路由,它不会强制浏览器重新加载或使用某种类型的本地存储来保证数据的安全。

另外我注意到你绑定了原语$scope.version = $rootScope.Data.Version; - 不要这样做,使用$scope.data = $rootScope.Data;然后{{data.Version}}。无论如何,你根本不应该使用$ rootScope。

答案 1 :(得分:0)

在控制器使用广播和方法之间传递值。请参阅链接http://www.dotnet-tricks.com/Tutorial/angularjs/HM0L291214-Understanding- $ emit, - $ broadcast-and- $ on-in-AngularJS.html

答案 2 :(得分:0)

你知道我在使用Angular 2年后发现了什么,使用像$ scope.version这样的直接变量对Angular来说并不是最好的,因为它们会添加不同的手表,在你的情况下你会重写&#39;版本&#39;

无论如何,尝试编写所有在不同控制器,服务,指令等之间同步的内容。

    var state = {
        version: $rootScope.Data.Version,
        anyOtherVariable: value
    };
    $scope.state = state;