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>

  

猛戳代码测试地址

angularjs——module的更多相关文章

  1. AngularJS -- Module (模块)

    点击查看AngularJS系列目录 转载请注明出处:http://www.cnblogs.com/leosx/ 什么是AngularJS的模块 我们所说的模块,是你的AngularJS应用程序的一个组 ...

  2. Angularjs Module类的介绍及模块化依赖

    后面的学习我们会遵循一个控制器管理一个视图,一个路由对应一个视图的单一原则,所以再不会将controller控制器代码直接写到 index.html 中. 我们会应用到angular.js中强大的模块 ...

  3. AngularJS-01.AngularJS,Module,Controller,scope

    1.AngularJS 一个构建动态Web应用程序的结构化框架. 基于JavaScript的MVC框架.(  MVC ---- Model(模型).View(视图).Controller(控制器) ) ...

  4. angularJS module里的'服务'

    首先,为了举栗子,先写好如下的模型,控制器,html: html: <!DOCTYPE html> <html ng-app="serviceApp"> & ...

  5. AngularJS 30分钟快速入门【译】

    引用自:http://www.revillweb.com/tutorials/angularjs-in-30-minutes-angularjs-tutorial/,翻译如下: 简介 我三年前开始使用 ...

  6. Integrating AngularJS with RequireJS

    Integrating AngularJS with RequireJS When I first started developing with AngularJS keeping my contr ...

  7. 4.了解AngularJS模块和依赖注入

    1.模块和依赖注入概述 1.了解模块 AngularJS模块是一种容器,把代码隔离并组织成简洁,整齐,可复用的块. 模块本身不提供直接的功能:包含其他提供功能的对象的实例:控制器,过滤器,服务,动画 ...

  8. Make AngularJS $http service behave like jQuery.ajax()(转)

    There is much confusion among newcomers to AngularJS as to why the $http service shorthand functions ...

  9. AngularJS基础总结

    w3shools    angularjs教程  wiki   <AngularJS权威教程> Introduction AngularJS is a JavaScript framewo ...

随机推荐

  1. 信息安全实验四:information-security

    title: authentication date: 2016-01-13 14:33:22 categories: information-security tags: authenticatio ...

  2. GUI编程(一)-----概述

    软件的交互方式 1.命令交互方式. 2.图像交互方式.Java提供了专业的API用于开发图形用户界面(GUI--> Graphic  User   Interface). GUI的分类 1.AW ...

  3. android_demo 之生成颜色

    老师说循环出颜色数字  然后显示出来 他说的什么一脸懵逼(=@__@=)   代码还在手上也还是懵逼 (づ。◕‿‿◕。)づ 不管了   留个脚印在这 以后想起来   至少也知道 直接上代码吧    说 ...

  4. LIBSVM之一

    libSVM简单的介绍 libSVM是台湾林智仁(Chih-Jen Lin) 教授2001年开发的一套支持向量机库,这套库运算速度挺快,可以很方便的对数据做分类或回归.由于libSVM程序小,运用灵活 ...

  5. 用GOACCESS分析NGINX日志

    参考URL: http://4b3r.com/goaccess-analyze-nginx-access-log/64/ http://jesuspan.sinaapp.com/crontab%E6% ...

  6. 创建.NET应用程序所经历的步骤

    1.使用某种.NET兼容语言(如C#)编写应用程序.2.把代码编译为(CIL),存储在程序集中.3.在执行代码时(如果这是一个可执行文件,就自动运行,或者在其他代码使用它时运行),首先必须使用JIT( ...

  7. 配置Delphi工具菜单 转

    配置Delphi工具菜单 Delphi工具菜单是可配置的.缺省时,Delphi Tools工具菜单的菜单项为[Database Desktop].[Image Editor].[Package Col ...

  8. bzoj1965 [Ahoi2005]SHUFFLE 洗牌

    Description 为了表彰小联为Samuel星球的探险所做出的贡献,小联被邀请参加Samuel星球近距离载人探险活动. 由于Samuel星球相当遥远,科学家们要在飞船中度过相当长的一段时间,小联 ...

  9. Android UI 之TextView控件属性列表

    在网上收集到了TextView 的属性,在开发过程中还是挺有用的. android:autoLink 设置是否当文本为URL链接/email/电话号码/map时,文本显示为可点击的链接.可选值(non ...

  10. 在什么情况下使用struct,struct与class的区别

    Struct定义和使用 类是引用类型,是保存在托管堆中的.通过定义类,我们可以在数据的生存期上得到很高的灵活性,但是也会让程序的性能有一定的损失.虽然这种损失很小,但当我们只需要定义一个很小的结构时, ...