03、AngularJs的模块与控制器
大部分的应用程序都有一个主方法(main)来组织,实例化,启动应用程序。而AngularJs应用是没有主方法的,它是通过模块来声明应用应该如何启动的。同时,模块允许声明来描述应用中依赖关系,以及如何进行组装和启动:
1、AngularJs的模块是组织业务的一个框架,在一个模块中定义多个服务。当引入一个模块的时候,就可以使用这个模块提供的一种或者多种服务。
2、AngularJs本身的一个默认的模块是ng,ng模块提供了$http,$scope等等的服务。
3、服务只是AngularJs提供的多种机制中的一种,其他的还有指令(directive),过滤器(filer)以及其他的配置信息。
4、在AngularJs中,也可以在已有的模块中定义一个服务,也可以先定义一个模块,然后在新模块中定义新的服务。
5、在AngularJs中,服务是需要显示的声明依赖(引入)关系的,让ng自动引入服务中。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body ng-app="ngApp">
<div ng-controller="firstController">
<input type="text" ng-model="name"/>
{{name}}
</div>
</body>
<script type="text/javascript" src="../public/javascripts/lib/angular.js"></script> <script type="text/javascript">
angular.module('ngApp', []).controller("firstController",function($scope){
$scope.name="xixi";
});
</script> </html>
上面是模块跟控制器的定义方式。我们使用augularjs的module方法定义一个模块 ngApp,中括号[]表示该模块没有依赖,如果有依赖的话会在中括号写上依赖的模块名字。
我们使用augularjs的controller方法定义一个控制器firstController。在html页面中ng-app="ngApp"是定义了这个模块的控制位置,而ng-controller="firstController"则是定义了控制器的作用区域。
本篇中的示例代码运行的结果如下:

03、AngularJs的模块与控制器的更多相关文章
- AngularJS:模块
ylbtech-AngularJS:模块 1.返回顶部 1. AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. ...
- 模块和控制器包含在JS文件中
在AngularJS应用程序中,通常是把模块和控制器包含在javascript文件中. <!DOCTYPE html><html><head><meta ht ...
- Angularjs 异步模块加载项目模板
ng-lazy-module-seed(Angularjs 异步模块加载项目模板) 相信做过SPA项目的朋友都遇到过这个问题:页面初始化时需要加载文件太大或太多了,许多文件加载后很可能不会运行到,这是 ...
- iOS不得姐项目--推荐关注模块(一个控制器控制两个tableView),数据重复请求的问题,分页数据的加载,上拉下拉刷新(MJRefresh)
一.推荐关注模块(一个控制器控制两个tableView) -- 数据的显示 刚开始加载数据值得注意的有以下几点 导航控制器会自动调整scrollView的contentInset,最好是取消系统的设置 ...
- AngularJS: 自定义指令与控制器数据交互
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- AngularJS -- Module (模块)
点击查看AngularJS系列目录 转载请注明出处:http://www.cnblogs.com/leosx/ 什么是AngularJS的模块 我们所说的模块,是你的AngularJS应用程序的一个组 ...
- 黄聪:AngularJS 动态加载控制器实例-ocLoazLazy
一.AngularJS动态加载控制器和视图实例 路由配置关键代码: //二级页面 $stateProvider.state('main', { url: '/:name', /**如果需要动态加载数据 ...
- YII2中使用RBAC对模块,控制器,方法的权限控制以及规则的使用
在使用YII2中自带的RBAC时,需要先配置config/web.php: return [ // ... 'components' => [ 'authManager' => [ 'cl ...
- TP5.1/TP框架的访问控制,访问不存在的模块、控制器、方法等控制
TP框架的访问控制,默认模块.控制器.方法等 在tp框架中,config文件夹下的app.php文件可以设置默认的空模块名,默认的空控制器名. 举例:以上项目中有admin.common.api.er ...
随机推荐
- 根目录97 <input file>标签,把图片上传到服务器(跟增删改查一起实现)
首先来个简单的html页面: enctype="multipart/form-data" encoding="multipart/form-data" acti ...
- Light OJ 1029- Civil and Evil Engineer (图论-最小生成树)
题目链接:http://www.lightoj.com/volume_showproblem.php?problem=1029 题目大意:一个发电站,给n座房子供电, 任意房子之间有电线直接或者间接相 ...
- leveldb 学习笔记之VarInt
在leveldb在查找比较时的key里面保存key长度用的是VarInt,何为VarInt呢,就是变长的整数,每7bit代表一个数,第8bit代表是否还有下一个字节, 1. 比如小于128(一个字节以 ...
- vim--macro
例: qa some vim command q 这个宏只记录了vim命令到寄存器a中,执行这个宏可以用命令: @a 也可以加上执行次数: 10@a 执行10次 当你执行过一次@a之后,你可以用 @@ ...
- Java 枚举7种常见用法
(转)原创地址:http://blog.lichengwu.cn/java/2011/09/26/the-usage-of-enum-in-java/ JDK1.5引入了新的类型--枚举.在 Java ...
- include,import,@class的区别
1.#include与#import功能一样,都是导入头文件 2.区别是#include是单纯导入头文件,如果重复导入头文件,头文件就被导入多分 3.#import在导入头文件之前会检查之前是否导入过 ...
- MVC 构建图片/文件选择器 参考其它CMS功能
实现结果,如下 点击选择图片,弹出一个iframe框 顶部默认图片根目录,依次下面是文件列表 底部是选择的文件地址,以及上传新的图片和文件 加载iframe 调用js方法 function initF ...
- csrf跨站请求伪造
如何杜绝跨站请求伪造? 1.要让服务器知道本次请求是不是冒用了用户的身份→ 2.服务器发给用户一个凭证,用户请求时需携带此凭证→ 3.此凭证只能用户看到而且冒用者看不到→ 4.这就用到了浏览器的安全机 ...
- Flask备注二(Configurations, Signals)
Flask备注二(Configuration, Signals) Flask是一个使用python开发Web程序的框架.依赖于Werkzeug提供完整的WSGI支持,以及Jinja2提供templat ...
- jQuery事件笔记
bind(eventType[,data],hanlder):eventType表示要创建的处理器指定事件类型的名称.可以使用空格分隔的列表指定多个事件类型.data(对象)调用者提供的数据,用来附加 ...