AngularJS 学习笔记

AngularJS 表达式 与 JavaScript 表达式

类似于 JavaScript 表达式，AngularJS 表达式可以包含字母，操作符，变量。

与 JavaScript 表达式不同，AngularJS 表达式可以写在 HTML 中。

与 JavaScript 表达式不同，AngularJS 表达式不支持条件判断，循环及异常。

与 JavaScript 表达式不同，AngularJS 表达式支持过滤器。

ng-app 指令

ng-app 指令定义了 AngularJS 应用程序的 根元素。

ng-app 指令在网页加载完毕时会自动引导（自动初始化）应用程序。

稍后您将学习到 ng-app 如何通过一个值（比如 ng-app="myModule"）连接到代码模块。

ng-init 指令

ng-init 指令为 AngularJS 应用程序定义了 初始值。

通常情况下，不使用 ng-init。您将使用一个控制器或模块来代替它。

稍后您将学习更多有关控制器和模块的知识。

ng-model 指令

ng-model 指令 绑定 HTML 元素 到应用程序数据。

ng-model 指令也可以：

为应用程序数据提供类型验证（number、email、required）。

为应用程序数据提供状态（invalid、dirty、touched、error）。

为 HTML 元素提供 CSS 类。

绑定 HTML 元素到 HTML 表单。

ng-repeat 指令

ng-repeat 指令对于集合中（数组中）的每个项会 克隆一次 HTML 元素。

你可以通过以下方式来调用指令：

元素名　 （ 除了template 其他都不需要设置 ， ）

属性　　 （ 同上）

类名 （ 需要设置 restrict : "C"）

注释 （ 需要设置 restrict： "M" , replace : true ）

限制使用

你可以限制你的指令只能通过特定的方式来调用。

restrict 值可以是以下几种:

E

作为元素名使用

A

作为属性使用

C

作为类名使用

M

作为注释使用

restrict 默认值为

EA

, 即可以通过元素名和属性名来调用指令。

验证用户输入

<form ng-app="" name="myForm">
Email:
<input type="email" name="myAddress" ng-model="text">
<span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址 </span>
</form>

以上实例中，提示信息会在

ng-show

属性返回

true

的情况下显示。