标签:
一、全局的写法
有可能会跟其他程序有冲突
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src="angular.min.js"></script> <script> function Aaa($scope){ $scope.name = ‘hello‘; } function Bbb($scope){ $scope.name = ‘hi‘; } </script> </head> <body> <div ng-controller="Aaa"> <p>{{name}}</p> </div> <div ng-controller="Bbb"> <p>{{name}}</p> </div> </body> </html>
二、模块化的写法
<!DOCTYPE HTML> <html ng-app="myApp"><!--使用了模块方式开发,那么就要指定页面是从哪个模块进行初始化的,因为页面中可能有非常多的模块--> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src="angular.min.js"></script> <script> //通过这样的方法,实现模块化,接收两个参数,第一个表示这个模块的名字,第二个是一个数组,里面写的是当前模块要依赖的其他模块,现在不需要依赖,那么就空数组 var m1 = angular.module(‘myApp‘,[]); m1.controller(‘Aaa‘,function($scope){ $scope.name = ‘hello‘; }); m1.controller(‘Bbb‘,function($scope){ $scope.name = ‘hi‘; }); </script> </head> <body> <div ng-controller="Aaa"> <p>{{name}}</p> </div> <div ng-controller="Bbb"> <p>{{name}}</p> </div> </body> </html>
上面就是模块化开发的写法,但是当需要压缩处理的话,就不能这么写了
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src="angular.min.js"></script> <script> var m1 = angular.module(‘myApp‘,[]); m1.controller(‘Aaa‘,[‘$scope‘,function($scope){ $scope.name = ‘hello‘; }]); m1.controller(‘Bbb‘,[‘$scope‘,function($scope){ $scope.name = ‘hi‘; }]); </script> </head> <body> <div ng-controller="Aaa"> <p>{{name}}</p> </div> <div ng-controller="Bbb"> <p>{{name}}</p> </div> </body> </html>
标签:
原文地址:http://www.cnblogs.com/LO-ME/p/4564136.html