亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

angularjs directive link 屬性 問題?

angularjs directive link 屬性 問題?

元芳怎么了 2019-02-04 10:06:02
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';    }  };});這個在官網上的directive代碼,link函數起到的什么作用,解釋有點費解,然后其中有三個參數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.這個用法是怎樣的,scope好像就是return中得scope屬性。。
查看完整描述

2 回答

?
至尊寶的傳說

TA貢獻1789條經驗 獲得超10個贊

首先我們先來聊聊你列出的directive中的幾個屬性:

  1. restrict
    E: 表示該directive僅能以element方式使用,即:<my-dialog></my-dialog>
    A: 表示該directive僅能以attribute方式使用,即:<div my-dialog></div>
    EA: 表示該directive既能以element方式使用,也能以attribute方式使用

  2. transclude
    你的directive可能接受頁面上的其他html內容時才會用到,建議你先去掉該參數。有些高階了。

  3. scope
    當你寫上該屬性時,就表示這個directive不會從它的controller里繼承$scope對象,而是會重新創建一個。

  4. templateUrl
    你的directive里的html內容

  5. link
    可以簡單理解為,當directive被angular 編譯后,執行該方法

這里你說的沒錯,link中的第一個參數scope基本上就是你說的上面寫的那個scope。

element簡單說就是$('my-dialog')

attrs是個map,內容是你這個directive上的所有屬性,例如:你在頁面上如果這樣寫了directive:

<my-dialog type="modal" animation="fade"></my-dialog>

attrs就是:
{
type: 'modal',
animation: 'fade'
}


查看完整回答
反對 回復 2019-03-17
  • 2 回答
  • 0 關注
  • 510 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號