Angularjs 3 ways to set global variables

There are two kinds of Angularjs itself, the method of setting global variables, and the method of setting global variables with js, there are altogether three KINDS. The function to be implemented is that the global variables defined in the Ng-app can be used in different ng-controller.

1, the direct definition of global variable by var, This pure JS is the Same.

2, set the global variable with ANGULARJS Value.

3, use ANGULARJS constant to set global Variables.

Here is an example to illustrate the above 3 methods:

Instance:

1, in the app module, define global variables

View Copy print?

2. ' Use strict ';
6. /* App Module */
10. var test2 = ' Tank '; //method 1, Define global variables
14. var Phonecatapp = angular.module (' Phonecatapp ', [ //define a Ng-app
16. ' Ngroute ',
18. ' Phonecatcontrollers ',
20. ' Tanktest '
22. ]);
26. Phonecatapp.value (' test ', {"test":"test222","test1":"test111"}); //method 2 Define global variables
30. Phonecatapp.constant (' constanttest ', ' This is constanttest '); //method 3 Define global variables
34. Phonecatapp.config ([' $routeProvider ', //set Route
36. function ($routeProvider) {
38. $routeProvider.
40. When ('/phones ', {
42. Templateurl: ' partials/phone-list.html ' //the controller is not set here and can be added to the module Ng-controller
44. }).
46. When ('/phones/:p honeid ', {
48. Templateurl: ' partials/phone-detail.html ',
50. Controller: ' Phonedetailctrl '
52. }).
54. When ('/login ', {
56. Templateurl: ' partials/login.html ',
58. Controller: ' Loginctrl '
60. }).
62. otherwise ({
64. Redirectto: '/login '
66. });
68. }]);

2, calling the global variable in the controller

View Copy print?

2. ' Use strict ';
6. /* Controllers */
10. var phonecatcontrollers = angular.module (' phonecatcontrollers ', []);
14. Phonecatcontrollers.controller (' Phonelistctrl ', [' $scope ',' Test ', 'constanttest ',
16. function ($scope, test,constanttest) {
18. $scope. test = test; //method 2, Assign the global variable to $scope.test
20. $scope. constanttest = constanttest; //method 3, Assignment
22. $scope. test2 = test2; //method 1, Assignment
24. }]);

3, look at the effect in HTML

View Copy print?

1. <div data-ng-controller="phonelistctrl" >
2. {{test.test1}}
3. {{constanttest}}
4. {{test2}}
5. </div>
7. Result: test111 This is Constanttest tank

In fact, we can use other methods to implement global variables, such as: Angularjs factory Function.

83

Address: http://blog.51yip.com/jsjquery/1601.html

Angularjs 3 ways to set global variables