我有一个问题,我在控制器的范围上初始化一个变量。然后当用户登录时,它在另一个控制器中被更改。该变量用于控制导航栏等内容,并根据用户类型限制对站点部分内容的访问,因此保持其值很重要。它的问题是,初始化它的控制器,被angular以某种方式再次调用,然后将变量重置回初始值。
我认为这不是声明和初始化全局变量的正确方式,好吧,它并不是真正的全局,所以我的问题是,正确的方式是什么?有没有什么好的例子可以在当前版本的angular中使用?
我有一个问题,我在控制器的范围上初始化一个变量。然后当用户登录时,它在另一个控制器中被更改。该变量用于控制导航栏等内容,并根据用户类型限制对站点部分内容的访问,因此保持其值很重要。它的问题是,初始化它的控制器,被angular以某种方式再次调用,然后将变量重置回初始值。
我认为这不是声明和初始化全局变量的正确方式,好吧,它并不是真正的全局,所以我的问题是,正确的方式是什么?有没有什么好的例子可以在当前版本的angular中使用?
当前回答
localStorage.username = 'blah'
如果你用的是现代浏览器的话。尽管知道你的值都将被转换成字符串。
也有方便的好处被缓存之间重新加载。
其他回答
其实很简单。(如果你使用的是Angular 2+的话。)
简单的添加
declare var myGlobalVarName;
在组件文件顶部的某个地方(例如在“import”语句之后),您将能够在组件中的任何地方访问“myGlobalVarName”。
如果你只是想存储一个值,根据Angular的Providers文档,你应该使用value recipe:
var myApp = angular.module('myApp', []);
myApp.value('clientId', 'a12345654321x');
然后像这样在控制器中使用它:
myApp.controller('DemoController', ['clientId', function DemoController(clientId) {
this.clientId = clientId;
}]);
使用提供者、工厂或服务也可以达到同样的效果,因为它们“只是提供者菜谱上的语法糖”,但使用值可以用最少的语法实现您想要的效果。
另一个选项是使用$rootScope,但这不是一个真正的选项,因为你不应该使用它,因为同样的原因,你不应该在其他语言中使用全局变量。建议有节制地使用。
因为所有作用域都继承自$rootScope,如果你有一个变量$rootScope。数据,有人忘记了数据已经定义并创建$scope。本地范围内的数据将会遇到问题。
如果你想修改这个值并让它在你的所有控制器上保持不变,请使用一个对象并修改属性,记住Javascript是通过“引用的副本”传递的:
myApp.value('clientId', { value: 'a12345654321x' });
myApp.controller('DemoController', ['clientId', function DemoController(clientId) {
this.clientId = clientId;
this.change = function(value) {
clientId.value = 'something else';
}
}];
JSFiddle例子
localStorage.username = 'blah'
如果你用的是现代浏览器的话。尽管知道你的值都将被转换成字符串。
也有方便的好处被缓存之间重新加载。
尝试一下,你不会强制在控制器中注入$rootScope。
app.run(function($rootScope) {
$rootScope.Currency = 'USD';
});
你只能在运行块中使用它,因为配置块不会提供给你使用$rootScope服务。
// app.js or break it up into seperate files
// whatever structure is your flavor
angular.module('myApp', [])
.constant('CONFIG', {
'APP_NAME' : 'My Awesome App',
'APP_VERSION' : '0.0.0',
'GOOGLE_ANALYTICS_ID' : '',
'BASE_URL' : '',
'SYSTEM_LANGUAGE' : ''
})
.controller('GlobalVarController', ['$scope', 'CONFIG', function($scope, CONFIG) {
// If you wish to show the CONFIG vars in the console:
console.log(CONFIG);
// And your CONFIG vars in .constant will be passed to the HTML doc with this:
$scope.config = CONFIG;
}]);
在你的HTML中:
<span ng-controller="GlobalVarController">{{config.APP_NAME}} | v{{config.APP_VERSION}}</span>