Angularjs之基本概念梳理(一)
1.Angularjs指令属性ng-app和ng-controller的理解
ng-app指令-标记了AngularJS脚本的作用域,在<html>中添加ng-app属性即说明整个<html>都是AngularJS脚本作用域。开发者也可以在局部使用ng-app指 令,如<div ng- app>,则AngularJS脚本仅在该<div>中运行。
ng-controller指令-定义了应用程序控制器。控制器可以初始化数据模型,它在建立模型(model)和视图(view)之间的数据绑定中起到至关重要的作用。AngularJS 使用$scope 对象 来调用控制器。 $scope(相当于作用域、控制范围) 是一个应用象(属于应用变量和函数),用来保存AngularJS Model(模型)的对象。
function PhoneListCtrl($scope) {
$scope.phones = [
{"name": "Nexus S",
"snippet": "Fast just got faster with Nexus S."},
{"name": "Motorola XOOM™ with Wi-Fi",
"snippet": "The Next, Next Generation tablet."},
{"name": "MOTOROLA XOOM™",
"snippet": "The Next, Next Generation tablet."}
];
}
链接地址:http://www.angularjs.cn/A003 http://www.angularjs.cn/A005
2.Angularjs的模块化和模块的加载和依赖
Angularjs模块-将一个应用程序碎片化,每个单独的模块式AngularJSy应用程序的一部分,它可以是一个Controller,也可以是一个Service服务,也可以是一个过滤器(Filter),也可以是一个directive(指令)等等…都是属于一个模块。一个模块,其实是一个在应用程序的引导程序中运行的,一个配置的集合和运行块的集合。拆分的原因是,在你的测试中常常需要忽略掉初始化代码,因为这些代码比较难测试。通过把它拆分出来就能在测试中方便地忽视掉它。通过只加载和当前测试相关的模块,也能使测试更专一。
应用程序运行启动时,加载装配各个模块,然后这些模块的组合,构成了你的应用程序,其中模块之间因为有依赖关系所以会有优先级
链接地址(http://www.tuicool.com/articles/nAZ3yq http://www.jb51.net/article/60505.htm)
配置块
其实在模块上有一些非常方便的方法,它们就相当于是一个 config 配置块,看例子:
angular.module('myModule', []).
value('a', 123).
factory('a', function() { return 123; }).
directive('directiveName', ...).
filter('filterName', ...);
// is same as
angular.module('myModule', []).
config(function($provide, $compileProvider, $filterProvider) {
$provide.value('a', 123);
$provide.factory('a', function() { return 123; });
$compileProvider.directive('directiveName', ...);
$filterProvider.register('filterName', ...);
});
当AngularJS在进行引导启动你的应用程序的时候,它会首先定义所有的常量。然后再在配置块中使用同一个 常量列表 去注册它们。
一个模块就是一系列配置和代码块的集合,它们是在启动阶段就附加到应用上的。一个最简单的模块由两类代码块集合组成的:
配置代码块 - 在注入提供者注入和配置阶段执行。只有注入提供者和常量可以被注入到配置块中。这是为了防止服务在被配置好之前就被提前初始化。
运行代码块 - 在注入器被创建后执行,被用来启动应用的,它会在所有的服务配置完毕,注入器被创建完毕之后执行。只有实例和常量能被注入到运行块中。这是为了防止在运行后还出现对系统的配置。
模块可以把其他模块列为它的依赖。“依赖某个模块”意味着需要把这个被依赖的模块在本块模块之前被加载。换句话说被依赖模块的配置块会在本模块配置块前被执行。运行块也是一样。任何一个模块都只能被加载一次,即使它被多个模块依赖。所以模块加载具有优先级
依赖关系
一个模块,它知道所有它所依赖的其它模块,也就是说在它加载起来前,需要将它所依赖的其它所有模块给加载起来。换句换说,对于需要配置块的模块来说,配置块一定是在需要它的模块初始化之前就被初始化完毕了。 同样的,运行块(run block)也是这样的,一个模块,会且仅会被加载一次,无论有多少个模块引用了它,它都只会被加载一次的。
小插曲:模板 视图组件被AngularJS用下面这个模板构建出来:
<html ng-app>
<head>
...
<script src="lib/angular/angular.js"></script>
<script src="js/controllers.js"></script>
</head>
<body ng-controller="PhoneListCtrl">
<ul>
<li ng-repeat="phone in phones">
{{phone.name}}
<p>{{phone.snippet}}</p>
</li>
</ul>
</body>
</html>
<html ng-app>
<head>
...
<script src="lib/angular/angular.js"></script>
<script src="js/controllers.js"></script>
</head>
<body ng-controller="PhoneListCtrl">
<ul>
<li ng-repeat="phone in phones">
{{phone.name}}
<p>{{phone.snippet}}</p>
</li>
</ul>
</body>
</html>
Angularjs之基本概念梳理(一)的更多相关文章
- [DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event
[DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event 事件 事件(Event)是用来通知代码,一些有趣的事情发生了. 每一个Event都会被一个E ...
- Angularjs,WebAPI 搭建一个简易权限管理系统 —— Angularjs名词与概念(一)
目录 前言 Angularjs名词与概念 Angularjs 基本功能演示 系统业务与实现 WebAPI项目主体结构 Angularjs 前端主体结构 2. 前言 Angularjs开发CRUD类型的 ...
- 前端 初识angularJS的基本概念
DEMO1演示地址:http://webenh.chinacloudsites.cn/default/demo1 今天在这里分享分享我个人学习angular的知识点总结.在还没有接触到angula ...
- 初识angularJS的基本概念
今天在这里分享分享我个人学习angular的知识点总结.在还没有接触到angular的时候,还真的不知道它到底有什么作用,直到我开始学习它,并且运用到它的时候,才知道angular这么强大.作为一个前 ...
- Spring 笔记(一)概念梳理
概念 预备知识 1. POJO POJO是Plain Old Java Object的缩写,是软件开发大师Martin Fowler提出的一个概念,指的是一个普通Java类.也就说,你随便编写一个Ja ...
- JavaWeb三大器(过滤器、拦截器、监听器)概念梳理
最近工作碰到了一个问题:项目A需要收集项目B中的用户活跃数信息,最后通过HttpSessionAttributeListener实现.在开发过程中,网上查找了过滤器.拦截器.监听器的帖子,这里对自己收 ...
- Web Service概念梳理
计算机技术难理解的很多,Web Service 对我来说就是一个很难理解的概念:为了弄清它到底是什么,我花费了两周的时间,总算有了一些收获,参考了不少网上的资料,但有些概念说法不一.我以w3c和 一些 ...
- 多通道(Multichannel)单通道(singlechannel)图像概念梳理
在做机器视觉时,常常要将一个多通道图像分离成几个单通道图像或者将几个单通道图像合成一个多通道图像,以方便图像处理,但是.写这篇博客,是为加深对这两个概念的理解,下面会给出部分OpenCV对单通道与多通 ...
- [转]Android中dp,px,sp概念梳理以及如何做到屏幕适配
http://blog.csdn.net/jiangwei0910410003/article/details/40509571 今天又开始我的App开发,因为之前一直做的是SDK,所以涉及到界面UI ...
随机推荐
- MySQL一些常用的时间函数
https://my.oschina.net/sallency/blog/470370
- 浅谈Java回调机制
像许多网上介绍回调机制的文章一样,我这里也以一个现实的例子开头:假设你公司的总经理出差前需要你帮他办件事情,这件事情你需要花些时间去做,这时候总经理肯定不能守着你做完再出差吧,于是就他告诉你他的手机号 ...
- iOS FMDB官方使用文档 G-C-D的使用 提高性能(翻译)(转)
由于FMDB是建立在SQLite的之上的,所以你至少也该把这篇文章从头到尾读一遍.与此同时,把SQLite的文档页 http://www.sqlite.org/docs.html 加到你的书签中.自动 ...
- 读写ZIP&JAR文件
1. ZipEntry 是包括目录的,也就是目录也被当做是一个单独的Entry,在列出它下面的文件之前先列出这个directory entry. 这个在解压ZIP文件的的时候特别有用,我们要先创建这个 ...
- Oracle本地网络分表模拟分区裁剪
来自讨论贴 http://www.itpub.net/thread-1877111-1-1.html 准备数据表 2014-07-20 01:38:10>create table tb_1 as ...
- iOS:特殊符号大全
特殊符号大全分享给大家,直接复制粘贴就可以使用了! ░ ▒ ▬ ♦ ◊ ◦ ♠ ♣ ▣ ۰•● ❤ ●•۰ ► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ▪ ▫ ☼ ♦ ♧♡♂♀♠♣♥❤☜☞☎☏⊙◎ ☺☻☼▧▨ ...
- robot framework安装步骤
1.安装python-2.7.11.amd64.msi 2.在命令行窗口输入python命令验证是否成功 3.安装wxPython2.8-win64-unicode-2.8.12.1-py27.exe ...
- jQuery操作控件
在项目中添加前台控件radio,操作两个div的显示和隐藏,其实是一个很简单的问题,但是费了老大劲才完成,也就是jQuery操作控件的一些基础知识.方法有三种,简单介绍: 1.给元素设置style属性 ...
- Jboss 安全和优化
一. Jboss后台启动:添加后台修改命令:vi run.shwhile true; do if [ "x$LAUNCH_JBOSS_IN_BACKGROUND" ...
- linux截取指定字符shell cut awk
[root@mylab demo]# echo $var939f61b61978a589d9873e9ea7fdf201b213dec2[root@mylab demo]# echo ${var:0: ...