Angular JS學習之指令

2022-05-05 01:18:13 字數 1152 閱讀 7313

1.angular js通過稱為指令的新屬性來擴充套件html;通過內建的指令來為應用新增功能;

2.angularjs指令:angularjs指令是擴充套件的html屬性,帶有字首ng-;

**ng-init:指令初始化應用程式資料

**ng-model:指令把元素(比如輸入域的值)繫結到應用程式;

在輸入框嘗試輸入:

姓名:你輸入的為:}

4.資料繫結:}表示式是乙個angularsjs資料繫結表示式;

angularjs中的資料繫結,同步了angularjs表示式與angularjs資料;

}是通過ng-model="firstname"進行同步;

例:數量:

**:總價:}

5.重複html元素:ng-repeat指令會重複乙個html元素

使用 ng-repeat來迴圈陣列

7.ng-init指令:為angularjs應用程式定義了初始值;通常情況下,不使用ng-init,使用乙個控制器或模組來代替它;

8.ng-model指令:繫結html元素到應用程式資料;

**為應用程式提供型別驗證(number,email,required)

**為應用程式資料提供狀態(invalid,dirty,touched,error)

**為html元素提供css類

**繫結html元素到html表單

9.ng-repeat指令:ng-repeat指令對於集合中(陣列中)每乙個項會轉殖一次html元素

10.建立自定義的指令:除了angularjs內建的指令外,還可以建立自定義的指令;

**可以使用.directive函式新增自定義的指令;

**要呼叫自定義指令,html元素上需新增自定義指令名;

11.可以使用以下方式呼叫指令:

(1)元素名:

(2)屬性:

(3)類名:

(4)注釋:

12.限制使用:限制你的指令只能通過特定的方式呼叫;

return{

restrict :"a",

template :""

**restrict值可以是以下幾種:預設為ea,即通過元素名和屬性名來呼叫指令

e作為元素名使用

a作為屬性使用

c作為類名使用

m作為注釋使用

AngularJS系列之常用指令

angularjs 指令是擴充套件的 html 屬性,帶有字首 ng 指令初始化乙個 angularjs 應用程式。ng init指令初始化應用程式資料。ng model指令把元素值 比如輸入域的值 繫結到應用程式。下面給乙個例子綜合的介紹一下這三個指令的用法 姓名 你輸入的為 執行這個程式你會發現...

AngularJS內建指令

這篇日誌簡單記錄了一些內建指令,先使用起來,再談一些有趣的東西。內建指令 所有的內建指令的字首都為ng,不建議自定義指令使用該字首,以免衝突。首先從一些常見的內建指令開始。先列出一些關鍵的內建指令,順便簡單說說作用域的問題。ng model 將表單控制項和當前作用域的屬性進行繫結,這麼解釋似乎也不太...

AngularJS的常見指令

angularjs的指令 指示,命令 指揮示意要做一件事情!指令 就是擴充套件了html的基本功能,通過額外的標籤 屬性來增強html功能 angular的指令在頁面中體現出來就是乙個標籤 屬性 class名稱 注釋等等 1.控制指令,用於angular應用程式載入流程控制 2.渲染指令,用於ang...