本篇將介紹angular的重要核心模組之一指令；那麼有關指令的一些介紹其實在前一篇《angular系列之表示式（二）》已有講過，便不再敘說，暫時只介紹部分指令，其餘指令後面有介紹使用；

ng-app 指令用於告訴 AngularJS 應用當前這個元素是根元素。所有 AngularJS 應用都必須要要一個根元素。同時也就是說當前在這個根元素下的所有html標籤與要執行的與這些標籤相關的業務邏輯都交給angularJS去管理了。

ng-init 指令初始化應用程式資料。
    注：(使用 ng-init 不是很常見。在控制器一章中有一個更好的初始化資料的方式。)
           (通常情況下，不使用 ng-init。您將使用一個控制器或模組來代替它。)

ng-model 指令把元素值（比如輸入域的值）繫結到應用程式或者是說指令綁定了 HTML 表單元素到 scope 變數中，如果 scope 中不存在變數, 將會建立它。；

   注：目前只支援<input>, <select>, <textarea>這三個標籤；

ngRepeat 就只相當與JS中的for迴圈+標籤生成,又或者是說相當於模板引擎功能；

1.ngModel與ngInit的結合使用

<div ng-init="quantity=1;price=5">
    <h2>價格計算器</h2>
    數量： <input type="number" ng-model="quantity">
    價格： <input type="number" ng-model="price">
    <p><b>總價：</b> {{ quantity * price }}</p>
</div>
 

2.ngRepeat使用

<!--例項1-->
<div ng-init="names=['liuqiang','kerui','liufeifei']">
    <p>使用 ng-repeat 來迴圈陣列</p>
    <ul>
        <li ng-repeat="x in names">
            {{x}}
        </li>
    </ul>
</div>

<!--例項2-->
<div ng-init="nameObj=[
{name:'liuqiang',country:'九江'},
{name:'kerui',country:'江西'},
{name:'liufeifei',country:'南昌'}]">
    <p>使用 ng-repeat 迴圈物件</p>
    <ul>
        <li ng-repeat="x in nameObj">
           姓名: {{x.name}} + 住址: {{x.country}}
        </li>
    </ul>
</div>
 

執行結果：