AngularJS四大特性
Google AnguarJS是一个JS框架,适用于以数据的CRUD操作为主的SPA应用。
四大特性:
(1)MVC模型
Model:模型,即数据=>JS中的变量
View:视图,即数据的呈现=>HTML
Controller:控制器,负责操作数据=>JS Fn
(2)双向数据绑定
(3)依赖注入(DI)
(4)模块化编程
1.AngularJS中的指令(directive)
(1)ngApp <ANY ng-app>
(2)ngInit <ANY ng-init="名=值; 名=值;">
(3)ngRepeat:循环输出当前标签
用法: <ANY ng-repeat="value in 数组变量名">
<ANY ng-repeat="(key, value) in 数组变量名">
类似于JS中的
for(var k in empList){ console.log(empList[k]); }
但for..in..遍历的是元素的下标,而ngRepeat遍历的是元素本身。
(4)ngIf: 只有表达式值为true时,当前元素才显示;否则当前元素会从DOM树中删除
用法:<ANY ng-if="布尔表达式">
(5)ngBind:用于输出一个表达式的值为当前元素的innerHTML,作用与{{表达式}}基本一样,可以防止闪动问题。
用法: <ANY ng-bind="表达式"></ANY>
(6)ngController: 创建一个控制器对象
用法:<ANY ng-controllerl="控制器函数名">
(7)ngValue:将一个模型变量绑定到View(表单输入域)
用法: <input ng-value="表达式">
2.AngularJS中的表达式(expression)
语法: {{ 表达式 }}
3.AngularJS中的MVC模型:
Model: 模型数据,即变量
View:数据展示,即HTML
Controller:创建/修改/删除模型数据,即JS函数
声明模型数据的两种方式:
(1) ngInit指令声明——把Model掺杂在View中——不推荐使用
(2) 使用控制器声明模型数据——把Model与View分离——推荐使用
声明模型数据 <= 声明控制器 <= 声明模块(module)
使用控制器来声明模型数据的步骤:
(1)使用angular.module()函数创建一个模块,并使用ngApp指令确定其作用范围
(2)在模块中使用.controller()函数声明一个控制器函数,并使用ngController指令在HTML中创建该控制器的对象
(3)在控制器中使用$scope对象声明模型数据
angular.module( '模块名', [ ] )
.controller( '控制器名', function( $scope ){
$scope.模型数据名 = 值 ;
} );
<html ng-app="模块名">
<div ng-controller="控制器名">
{{ 模型数据名 }}
</div>
</html>
易悦(深圳)科技有限公司
让快乐更简单
微信:EJoyYOJOY
微博:http://weibo.com/EJoyYOJOY
官网:http://www.ejoytec.com/
AngularJS四大特性的更多相关文章
- AngularJS 四大特性
1.模块化 2.双向数据绑定 3.依赖注入 4.mvc模式
- AngularJs学习笔记2——四大特性之MVC
angularJs的四大特性 ①.采用MVC的设计模式 ②.双向数据绑定 ③.依赖注入 ④.模块化设计 现在细说一下MVC的设计模式: MVC: Model(模型)--项目中的数据 View(视图)- ...
- AngularJS核心特性(四大点)
本人刚刚接触AngularJS,还不太熟悉,就说说我目前遇到的一些注意点吧. 1.调用外来文件script文件 AngularJS核心特性一 MVC MVC设计模式 html文件 <!DOCT ...
- MySQL之事务的四大特性
事务就是一组原子性的SQL查询,或者说一个独立的工作单元.如果数据库引擎能够成功地对数据应用该组查询的全部语句,那么久执行该组查询.如果其中任何一条语句因为崩溃或其他原因无法执行,那么所有语句都不会执 ...
- 前端CSS的工程化——掌握Sass这四大特性就够了
初遇 CSS,一见倾心 记得刚遇见css的时候,咱像是见了美人儿一样,简直是爱不释手啊,简简单单写几行算不上代码的代码,就能做出这么漂亮的东西,这也成了咱前端之路的最初动力. 然而,随着项目体量和页面 ...
- mysql进阶(二十三)数据库事务四大特性
数据库事务四大特性 原子性.一致性.分离性.持久性 原子性 事务的原子性指的是,事务中包含的程序作为数据库的逻辑工作单位,它所做的对数据修改操作要么全部执行,要么完全不执行.这种特性称为 ...
- 事务的四大特性(ACID):
事务的四大特性(ACID): 1.原子性(Atomicity): 事务中所有操作是不可再分割的原子单元.事务中所有操作要么都执行成功,要么都执行失败. 2.一致性(Consistency): 事 ...
- 数据库事务的四大特性以及事务的隔离级别(mysql)
本篇讲诉数据库中事务的四大特性(ACID),并且将会详细地说明事务的隔离级别. 如果一个数据库声称支持事务的操作,那么该数据库必须要具备以下四个特性: ⑴ 原子性(Atomicity) 原子性是指 ...
- maven安装和四大特性
一.安装配置maven 官网下载:http://maven.apache.org/download.html 1:解压后放在一个固定的位置 2:配置环境变量,具体如下 新建系统环境变量:MAVEN_H ...
随机推荐
- UIViewController中addChildViewController的作用
当在一个ViewController中添加一个子ViewController时,UI部分可以直接通过addSubView的方法添加,例如: 在一个ViewControllerA中添加ViewContr ...
- 第四章ContentProvider
No resource found that matches the given name 'Theme.AppCompat.Light'.
- lisp中的nil
ANSI Common Lisp 第二章 课后习题 7.只使用本章所介绍的操作符,定义一个函数,它接受一个列表作为实参,如果有一个元素是列表时,就返回真. (defun have-list (lst) ...
- IOS系列swift语言之课时六
这节课需要讲的就是协议,方法,委托模式(依赖倒转) 代码刷起中...... // // main.swift // ExAndProtocol // // Created by David on 23 ...
- 将mac上的项目上传到oschina,进行代码托管。
1.首先看一下自己是否有公钥, 在 我的资料-->SSH公钥 查看,如果没有,添加自己的SSH 公钥: SSH key 可以让你在你的电脑和 Git @ OSC 之间建立安全的加密连接. 2. ...
- iOS高效开发必备的10款Objective-C类库
http://blog.csdn.net/yhawaii/article/details/7392988
- struts2配置文件中Action中的各属性的含义
StrutsApacheBeanJSPServlet attribute: 这个属性用来指定ActionForm保存到指定上下文时所使用的属性名.如果不指定attribute属性的值,将使用 ...
- svn各个图标代表什么意思
最近参与公司项目开发要使用SVN,下面随笔记下在使用SVN中常见的图标各代表什么意思 灰色向右箭头:本地修改过 ,本地代码没有及时上库.灰色向右且中间有个加号的箭头:本地比SVN上多出的文件灰色向右且 ...
- linux内核升级图文攻略(转)
一.Linux内核概览Linux是一个一体化内核(monolithic kernel)系统.设备驱动程序可以完全访问硬件.Linux内的设备驱动程序可以方便地以模块化(modularize)的形式设置 ...
- html之如何让文字两端对齐
text-align: justify;/*英文*/ text-align-last: justify;/*中英文*/ text-align-last: justify;亲测有效(chrome)