angularJS-通过provider实现全局变量的读取和赋值

http://blog.csdn.net/xuexiiphone/article/details/51822692

简单全局变量的设置

1,通过var 直接定义global variable,这根纯js是一样的。 
2,用angularjs value来设置全局变量 。 
3,用angularjs constant来设置全局变量 。

示例代码如下:

  1. 在app文件中,声明三种变量
'use strict';  

/* App Module */  

var test2 = 'tank';         //方法1,定义全局变量  

var phonecatApp = angular.module('phonecatApp', [     //定义一个ng-app  
  'ngRoute',  
  'phonecatControllers',  
  'tanktest'  
]);  

phonecatApp.value('test',{"test":"test222","test1":"test111"});  //方法2定义全局变量  

phonecatApp.constant('constanttest', 'this is constanttest');    //方法3定义全局变量  
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  1. 在controller中对全局变量进行读取
'use strict';  

/* Controllers */  

var phonecatControllers = 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,赋值  
  }]);  
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

注意事项

  • var test;设置后,无需在controller声明的时候注入,直接使用即可。
  • value和contant,在app中初始化后,需要在controller声明时候注入到controller中,才能够使用。

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

使用provider实现全局变量。

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

  1. 在app中完成声明和初始化。
    <script type="text/javascript">
        var app = angular.module('ngRouteWxCtb', ['ngRoute','ngCookies']);

        //TODO:provider of globle uid and weixinIsInit param
        app.provider('userService', function () {
            var data = {uid:0,weixinIsInit:false};
            var f = function (uid,weixinIsInit) {
                if (uid != 0)
                {
                    data.uid= uid;
                    data.weixinIsInit = weixinIsInit;
                }
                return data;
            };
            this.$get = function () {
                return f;
            };
        });
    </script>
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  1. 在controller声明的时候,注入。
app.controller('myCtrl1', function ($scope, userService) {

    var data = userService(0, 0, false);//读取全局变量
    }));
 
 
  • 1
  • 2
  • 3
  • 4
app.controller('myCtrl2', function ($scope, userService) {

    var data = userService(123, 111, true);//设置全局变量
    }));
 
 
  • 1
  • 2
  • 3
  • 4
  1. 通过provider提供的get方法,实现参数的读取和赋值。

注意事项

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值