angularjs
  • directive
  • 2017-08-05 33 views 0 likes 
    0
    <cat color="black"></cat> 
    
    app.directive('cat', function() { 
        return { 
         restrict: 'E', 
         scope: { 
         color: '=' 
         }, 
         link: function(scope) { 
         alert(scope.color) 
         } 
        } 
    }); 
    

    它會提醒一個未定義的消息。

    我知道這是可行的,如果使用$ watch,但我不想,因爲參數可以有彼此依賴關係。

    我想要的就像Vue的掛載功能或類似的東西,我們可以直接使用parmameters來處理它。

    有沒有人知道如何達到這樣的目標?謝謝

    回答

    0

    定義scope: {}時,您有3個不同的屬性選項。

    1. =。這將以一種雙向關係將該指令中的屬性設置爲等於指令定義中指定的$scope屬性。即給出color: '='<cat color="black">,父指令將查找屬性$scope.black並嘗試將該屬性分配給color。對color的更改將改變black,反之亦然。
    2. @。這將以單向關係將指令中的屬性設置爲等於指令中指定的變量的。即<cat color="black">將立即並在初始化時設置color == "black"
    3. &。這會將指令中的屬性設置爲等於父項中的函數。即<cat color="black">將設置color == black,並且color()將執行black()

    。這說明,來完成你期待什麼,你有3種選擇:

    • 創建於父$scope.black屬性,並將其設置爲一個字符串值。
    • 將您的值作爲匿名字符串對象傳遞,即<cat color="'black'">
    • 將您的scope定義更改爲color: '@'

    示例:http://plnkr.co/edit/byxhKtAewLgOrFpRU8dg?p=preview

    相關問題