angular.module('docsTransclusionExample', []).controller('Controller', ['$scope', function($scope) { $scope.name = 'Tobias';}]).directive('myDialog', function() { return { restrict: 'E', transclude: true, scope: {}, templateUrl: 'my-dialog.html', link: function (scope, element) { scope.name = 'Jeff'; } };});這個(gè)在官網(wǎng)上的directive代碼，link函數(shù)起到的什么作用，解釋有點(diǎn)費(fèi)解，然后其中有三個(gè)參數(shù)scope：is an Angular scope object.element： is the jqLite-wrapped element that this directive matches.attrs： is a hash object with key-value pairs of normalized attribute names and their corresponding attribute values.這個(gè)用法是怎樣的，scope好像就是return中得scope屬性。。
2 回答
至尊寶的傳說
TA貢獻(xiàn)1789條經(jīng)驗(yàn) 獲得超10個(gè)贊
首先我們先來聊聊你列出的directive中的幾個(gè)屬性：
restrict
E： 表示該directive僅能以element方式使用，即：<my-dialog></my-dialog>
A： 表示該directive僅能以attribute方式使用，即：<div my-dialog></div>
EA: 表示該directive既能以element方式使用，也能以attribute方式使用transclude
你的directive可能接受頁面上的其他html內(nèi)容時(shí)才會(huì)用到，建議你先去掉該參數(shù)。有些高階了。scope
當(dāng)你寫上該屬性時(shí)，就表示這個(gè)directive不會(huì)從它的controller里繼承$scope對(duì)象，而是會(huì)重新創(chuàng)建一個(gè)。templateUrl
你的directive里的html內(nèi)容link
可以簡單理解為，當(dāng)directive被angular 編譯后，執(zhí)行該方法
這里你說的沒錯(cuò)，link中的第一個(gè)參數(shù)scope基本上就是你說的上面寫的那個(gè)scope。
element簡單說就是$('my-dialog')
attrs是個(gè)map，內(nèi)容是你這個(gè)directive上的所有屬性，例如：你在頁面上如果這樣寫了directive:
<my-dialog type="modal" animation="fade"></my-dialog>
那attrs就是：
{
type: 'modal',
animation: 'fade'
}
- 2 回答
- 0 關(guān)注
- 509 瀏覽
添加回答
舉報(bào)
0/150
提交
取消