内裤总动员之AngularJS指令

          各位观众老爷大家好,欢迎收看内裤总动员之程序猿的IT程序大讲堂,今天给大家分享一个新的东西就是.AngularJS.跟着上一次的继续,今天给大家分享一下AngularJS指令.

---

AngularJS 通过被称为指令的新属性来扩展 HTML。

AngularJS 通过内置的指令来为应用添加功能。

AngularJS 允许你自定义指令。

---

AngularJS指令

AngularJS 指令是扩展的 HTML 属性，带有前缀ng-。

ng-app指令初始化一个 AngularJS 应用程序。

ng-init指令初始化应用程序数据。

ng-model指令把元素值（比如输入域的值）绑定到应用程序。

ng-app

ng-app指令告诉 AngularJS，div元素是 AngularJS应用程序的"所有者"。

一个网页可以包含多个运行在不同元素中的 AngularJS 应用程序。

---

数据绑定

栗子:俩文本是通过ng-model指令同时指出的

---

重复 HTML 元素

ng-repeat指令会重复一个 HTML 元素：

ng-repeat

ng-repeat用在一个对象数组上.

ng-repeat

AngularJS 完美支持数据库的 CRUD（增加Create、读取Read、更新Update、删除Delete）应用程序。

把实例中的对象想象成数据库中的记录。

---

命令总结

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

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

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

---

自定义命令

除了 AngularJS 内置的指令外，我们还可以创建自定义指令。

你可以使用.directive函数来添加自定义的指令。

要调用自定义指令，HTML 元素上需要添加自定义指令名。

使用驼峰法来命名一个指令，runoobDirective, 但在使用它时需要以-分割,runoob-directive:

runoob-directive

以下实例方式也能输出同样结果:

类名:

注释:

---

限制使用

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

通过添加restrict属性,并设置只值为"A", 来设置指令只能通过属性的方式来调用:

restrict值可以是以下几种:

E只限元素名使用

A只限属性使用

C只限类名使用

M只限注释使用

restrict默认值为EA, 即可以通过元素名和属性名来调用指令。

---