Angularjs------- 定义全局变量的3中方法

最新推荐文章于 2021-01-31 22:37:18 发布

原创最新推荐文章于 2021-01-31 22:37:18 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ionic #angularjs #全局变量 #不同controller传值

angularjs 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了在AngularJS中如何通过三种不同的方式定义和使用全局变量，包括直接定义、使用value服务和constant服务，并展示了如何在控制器和HTML模板中访问这些变量。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在Angularjs，由于多个js文件的使用如app.js、controller.js、serveices.js，它们之间传递变量及相互使用各自的变量是非常常见的，下面我们来总结一下：

1.通过var直接定义的global varriable，这个跟纯js是一样；

2.用angularjs value来设置全局变量；

3.用angularjs constant来设置全局变量。

举例说明：

1.在app模块中，定义全局变量

var globalvar = '1111';         //方法1，定义全局变量  
  
var phonecatApp = angular.module('phonecatApp', [     //定义一个ng-app  
  'ngRoute',  
  'phonecatControllers',  
  'tanktest'  
]);  
  
phonecatApp.value('test',{"test2":"test222","test3":"test333"});  //方法2定义全局变量  
  
phonecatApp.constant('constanttest', 'this is constanttest');    //方法3定义全局变量

2.在controller中调用全局变量

var phonecatControllers = angular.module('phonecatControllers', []);  
  
phonecatControllers.controller('PhoneListCtrl', ['$scope','test','constanttest', //先注入到controller里面 
  function($scope,test,constanttest) {  
    $scope.test = test;                   //方法2，将全局变量赋值给$scope.test  
    $scope.constanttest = constanttest;   //方法3，赋值  
    $scope.globalvar  = globalvar              //方法1，赋值  
  }]);

这样就可以在一个controller给全局变量赋值，然后在其他controller里面用这个赋值了的变量了

例如： constanttest = “我是新赋值的”； $scope.constanttest = constanttest; 这是在输入constanttest的值为：我是新赋值的

3.在Html中的使用方法

<div data-ng-controller="PhoneListCtrl">  
    {{test.test1}}    
    {{constanttest}}  
    {{globlvar}}  
</div>

4.输出结果

结果：test111 this is constanttest 111

因为是全局变量，所以这3种变量在项目的哪个地方都可以用到，而且可以随时改变变量的值，随时获取变化以后的值，特别方便