Angularjs自身有二種，設置全局變量的方法，在加上js的設置全局變量的方法，總共有三種。要實現的功能是，在ng-app中定義的全局變量，在不同的ng-controller里都可以使用。

1、通過var 直接定義global variable，這根純js是一樣的。

2、用angularjs value來設置全局變量 。

3、用angularjs constant來設置全局變量 。

?

舉一個例子來說明上面3種方法：

1、 在app模塊中，定義全局變量

?/* 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定義全局變量?

phonecatApp.config(['$routeProvider',??????????????? //設置路由

? function($routeProvider) {

??? $routeProvider.

????? when('/phones', {

??????? templateUrl: 'partials/phone-list.html'????? //這里沒有設置controller，可以在模塊中加上ng-controller

????? }).

????? when('/phones/:phoneId', {

??????? templateUrl: 'partials/phone-detail.html',

??????? controller: 'PhoneDetailCtrl'

????? }).

????? when('/login', {

??????? templateUrl: 'partials/login.html',

??????? controller: 'loginctrl'

????? }).

????? otherwise({

??????? redirectTo: '/login'

????? });

? }]);

?

2、??? 在controller中調用全局變量?

/* 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，賦值

? }]);

?

3、??? 在html中看一下效果

<div data-ng-controller="PhoneListCtrl">

??? {{test.test1}}

??? {{constanttest}}

??? {{test2}}

</div>

?

結果：test111 this is constanttest tank

轉載于:https://www.cnblogs.com/xiaxianfei/p/5337755.html

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的Angularjs 设置全局变量的3种方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。