AngularJS自定義指令

2021-10-01 21:34:46 字數 999 閱讀 3671

除了 angularjs 內建的指令外,我們還可以建立自定義指令。

你可以使用 .directive函式來新增自定義的指令。

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

使用駝峰法來命名乙個指令,runoobdirective, 但在使用它時需要以 - 分割,runoob-directive:

>

<

/runoob-directive>

module(,

);directive

("runoobdirective"

,function()

;});

<

/script>

<

/body>

可以呼叫的方式有

相對應的呼叫restrict 值是以下幾種:

e 作為元素名使用

a 作為屬性使用

c 作為類名使用

m 作為注釋使用

restrict 預設值為 ea, 即可以通過元素名和屬性名來呼叫指令。

>

<

/runoob-directive>

<

!-- directive: runoob-directive --

>

"runoob-directive"

>

<

/div>

<

/div>

module(,

);directive

("runoobdirective"

,function()

;});

<

/script>

注意:<

/strong> 通過設定restrict<

/strong> 屬性值為 "a" 來設定指令只能通過 html 元素的屬性來呼叫。<

/p>

<

/body>

angularJs自定義指令

e 元素 a 屬性,預設值 c 類名 m 注釋 directive my directive expression priority 優先順序 用來表示指令使用的優先順序 如果乙個元素上具有兩個優先順序相同的指令,宣告在前面的那個會被優先呼叫。如果其中一 個的優先順序更高,則不管宣告的順序如何都會被...

AngularJS自定義指令

自定義的指令定義 1.directive 方法可以接受兩個引數,第乙個引數是指令的名字,第二個引數是函式,第二個引數用來返回指令的具體內容。2.指令的引數包括 restrict eacm 分別對應元素 屬性 類名 注釋 主要體現在呼叫指令時的不一樣 優先順序 ngrepeat,來定該自定義標籤的優先...

Angularjs 自定義指令

指令的作用可以簡單的描述為實現語義化的標籤,比如你在移動端h5應用中,有個經常用的功能,比如通訊錄的功能,不同的頁面都要用到,這時你可以將其封裝為指令,在使用的時候可以通過這樣的語義化的標籤直接在頁面中使用即可。首先實現乙個helloworld的例子,讓我們先上手自定義指令,先體會下指令的妙處。定義...