1、创建module
//第一个参数是模块的名称
var head=angular.module(‘headApp‘,[]);
head.controller("User",["$scope",function($scope){
$scope.UserName="admin";
$scope.LoginTime=new Date().toString();
}]);
2、创建module且此模块要依赖其它module
// 创建module且此模块要依赖其它模块
// 第二个参数是依赖的模块名称，如果不依赖任何模块要传空数组[]。
// 注意：如果第二个参数不传，则是获取当前名称的模块
var my=angular.module(‘myApp‘,["headApp"]);
my.controller("Content",["$scope",function($scope){
$scope.Text="this is a test page";
}]);
3、不同module有相同的controller时的调用方式
//如果当前模块和依赖具有相同的controller,则会调用当前模块的controller。
//当前模块没有此controller时，才会调用依赖模块中的controller
//可以对下面的controller代码进行注释(或去掉注释)，看页面的效果
// my.controller("User",["$scope",function($scope){
// $scope.UserName="admin123";
// $scope.LoginTime="2015-7-25";
// }]);
demo代码如下：
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>模块化</title>
<script type="text/javascript" src="angular.js"></script>
</head>
<body>
<div ng-controller="User">
<p>用户名：{{UserName}}</p>
<p>登录时间：{{LoginTime}}</p>
</div>
<div ng-controller="Content">
<p>{{Text}}</p>
</div>
</body>
</html>
<script type="text/javascript">
//创建module
//第一个参数是模块的名称
var head=angular.module(‘headApp‘,[]);
head.controller("User",["$scope",function($scope){
$scope.UserName="admin";
$scope.LoginTime=new Date().toString();
}]);
// 创建module且此模块要依赖其它模块
// 第二个参数是依赖的模块名称，如果不依赖任何模块要传空数组[]。
// 注意：如果第二个参数不传，则是获取当前名称的模块
var my=angular.module(‘myApp‘,["headApp"]);
my.controller("Content",["$scope",function($scope){
$scope.Text="this is a test page";
}]);
//不同module有相同的controller时的调用方式
//如果当前模块和依赖具有相同的controller,则会调用当前模块的controller。
//当前模块没有此controller时，才会调用依赖模块中的controller
//可以对下面的controller代码进行注释(或去掉注释)，看页面的效果
// my.controller("User",["$scope",function($scope){
// $scope.UserName="admin123";
// $scope.LoginTime="2015-7-25";
// }]);
</script>
时间： 2024-12-22 17:03:36