AngularJS 指令ng-app 指令ng-init 指令ng-model 指令ng-repeat 指令自定义的指令

angularjs 通过被称为 指令 的新属性来扩展 html。并且通过内置的指令来为应用添加功能。另外，angularjs 允许我们自定义指令。

angularjs为我们提供了很多指令，在前面我们也见到了一些，如：<code>ng-app</code>、’ng-bind’等。angularjs提供的指令我们可以查阅官网的文档，这里就不一一列举了，下面介绍几个比较常用的指令的用法，其他指令的使用也大同小异。

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

在之前的代码中，我们可以发现每一个angularjs的代码里都含有<code>ng-app</code>指令。<code>ng-app</code> 指令定义了 angularjs 应用程序的 根元素。在网页加载完毕时会自动引导（自动初始化）应用程序。

<code>ng-init</code> 指令为 angularjs 应用程序定义了 初始值。通常情况下，我们不使用 <code>ng-init</code>。我们将使用一个控制器或模块来代替它。

这是之前的一个示例，使用<code>ng-init</code>指令初始化了一个名为color的数组。

<code>ng-model</code> 指令 绑定 html 元素 到应用程序数据。另外<code>ng-model</code> 指令也可以：

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

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

为 html 元素提供 css 类。

绑定 html 元素到 html 表单。

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

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

我们可以使用 .directive 函数来添加自定义的指令。要调用自定义指令，html 元素上需要添加自定义指令名。我们需要使用驼峰法来命名一个指令， 例如：<code>mydirective</code>, 但在使用它时需要以 <code>-</code> 分割, <code>my-directive</code>。

我们可以通过元素名、属性、类名、注释来调用指令。

我们可以限制我们的指令只能通过特定的方式来调用。通过添加 <code>restrict</code> 属性来限制,例如：设置<code>restrict</code>值为 “a”, 则指令只能通过属性的方式来调用。

<code>restrict</code> 值可以是以下几种:

e 只限元素名使用

a 只限属性使用

c 只限类名使用

m 只限注释使用

<code>restrict</code> 默认值为 ea, 即可以通过元素名和属性名来调用指令。