AngularJS基于provider实现全局变量的读取和赋值方法

2024-02-17 20:26:03 142

本文实例讲述了AngularJS基于provider实现全局变量的读取和赋值方法。分享给大家供大家参考，具体如下：

简单全局变量的设置

1，通过var直接定义globalvariable，这根纯js是一样的。
2，用angularjsvalue来设置全局变量。
3，用angularjsconstant来设置全局变量。

示例代码如下：

在app文件中，声明三种变量

'usestrict';
/*AppModule*/
vartest2='tank';//方法1，定义全局变量
varphonecatApp=angular.module('phonecatApp',[//定义一个ng-app
'ngRoute',
'phonecatControllers',
'tanktest'
]);
phonecatApp.value('test',{"test":"test222","test1":"test111"});//方法2定义全局变量
phonecatApp.constant('constanttest','thisisconstanttest');//方法3定义全局变量

在controller中对全局变量进行读取

'usestrict';
/*Controllers*/
varphonecatControllers=angular.module('phonecatControllers',[]);
phonecatControllers.controller('PhoneListCtrl',['$scope','test','constanttest',
function($scope,test,constanttest){
$scope.test=test;//方法2，将全局变量赋值给$scope.test
$scope.constanttest=constanttest;//方法3，赋值
$scope.test2=test2;//方法1，赋值
}]);

注意事项

vartest；设置后，无需在controller声明的时候注入，直接使用即可。

value和contant，在app中初始化后，需要在controller声明时候注入到controller中，才能够使用。

这三种方式都存在一个问题，即只能够读取全局变量，无法对全局变量进行修改赋值。在很对业务逻辑中无法满足业务需求。

使用provider实现全局变量。

步骤与上面的value和contant差不多。

在app中完成声明和初始化。


varapp=angular.module('ngRouteWxCtb',['ngRoute','ngCookies']);
//TODO:providerofglobleuidandweixinIsInitparam
app.provider('userService',function(){
vardata={uid:0,weixinIsInit:false};
varf=function(uid,weixinIsInit){
if(uid!=0)
{
data.uid=uid;
data.weixinIsInit=weixinIsInit;
}
returndata;
};
this.$get=function(){
returnf;
};
});

在controller声明的时候，注入。

app.controller('myCtrl1',function($scope,userService){
vardata=userService(0,0,false);//读取全局变量
}));
app.controller('myCtrl2',function($scope,userService){
vardata=userService(123,111,true);//设置全局变量
}));

通过provider提供的get方法，实现参数的读取和赋值。

注意事项

代码中，我们对provider的赋值操作进行了取巧设计，当第一个参数等于0的时候，默认是读取，当第一个参数不为0的时候，实现的是设置后进行读取。这样，公用一个get方法即可，无需增加新的方法。

更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《AngularJS指令操作技巧总结》、《AngularJS入门与进阶教程》及《AngularJSMVC架构总结》

希望本文所述对大家AngularJS程序设计有所帮助。

AngularJS基于provider实现全局变量的读取和赋值方法

热门推荐

随机推荐