Angular JS 中 指令詳解

2022-03-17 06:03:27 字數 1781 閱讀 9922

angular js的強大功能就在於其可以自定義很多指令,現在就指令做一下詳細的剖析。

乙個angular js 指令(directive)需要指定乙個唯一的名字(mydirective)和乙個函式,其中返回乙個物件,該物件包含該指令應有的一些行為,具體參見如下所有的屬性。

.directive('mydirective', function

() ,

templateurl: string,

replace: boolean or string,

scope: boolean or object,

transclude: boolean,

controller: string or

function

(scope, element, attrs, transclude, otherinjectables) ,

controlleras: string,

require: string,

link:

function

(scope, ielement, iattrs) ,

compile:

//返回乙個物件或連線函式,如下所示:

function

(telement, tattrs, transclude) ,

post:

function

(scope, ielement, iattrs, controller)

}//或者

return

function

postlink(...)

}   };

});

.directive('mydirective', function() , 

//一段html**或者是乙個可以返回html片段的函式,注意

templateurl: string,
//可以是外部html檔案的路徑,也能是乙個返回外部html檔案路徑的函式,模板html的載入是非同步的

需要花費時間來編譯和鏈結,所以使用環境是乙個好的選擇。

replace: boolean or string,

//預設值為false ,表明引用該指令的dom元素是否會被模板替換還是在內部巢狀,
scope: boolean or object,  

//預設值是false,可以是true,也可以是乙個物件。

為true的時候,為此指令建立乙個新的作用域,並且該作用域繼承父級作用域

transclude: boolean,  

//預設false,可以將當前dom中的html內容嵌入到指令中使用ng-transclude的位置。

controller: string or       function(scope, element, attrs, transclude, otherinjectables) ,     controlleras: string,     require: string,     link: function(scope, ielement, iattrs) ,     compile: // 返回乙個物件或連線函式,如下所示:       function(telement, tattrs, transclude) ,           post: function(scope, ielement, iattrs, controller)         }         // 或者         return function postlink(...)       }    }; });

雲計算Dockerfile中指令詳解

dockerfile是乙個文字格式的配置檔案,用於快速建立自定義的映象。一 基礎結構 dockerfile有一行行命令語句組成,並支援以 開頭的注釋行 dockerfile分為四部分 基礎映象資訊 維護者資訊 映象操作指令和容器啟動時執行的指令 例 第一行必須制定基於的基礎映象 from ubunt...

AngularJS內建指令

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

AngularJS的常見指令

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