2013-10-14 102 views
0

似乎在我的情況下,角度指令「跛腳」img src的作用域對象。如果我起飛scope: { myDirectiveText: "=" },圖像將顯示。有了它,圖像不顯示。角度指令範圍與img src

這裏是指令

app.directive('myDirective', function(){ 
    return { 
     restrict: 'A', 
     scope: { myDirectiveText: "=" }, // having this will cause image to disappear. 
     link: function (scope, element, attrs) {} 
    }; 
}); 

這裏是我的HTML:

<div ng-repeat="anObject in myObjectsFromController"> 
    <img my-directive my-directive-text="'my text'" ng-src="{{ anObject.ImageUrl }}" /> 
</div> 

所以,從周圍ng-repeat生成的圖像。無論我使用ng-src還是僅使用src,都沒關係。如果my-directive具有指定的範圍「屬性」,則圖像不顯示。無論myDirectiveText是否= &或@並不重要 - 圖像仍將不顯示。

我有一個印象,一個屬性指令不會影響它指定的元素的其他屬性。我錯過了什麼或做錯了什麼?

回答

1

這看起來像一個孤立範圍問題。一旦您在指令中將scope定義爲散列,則您的指令中元素的所有屬性現在都使用與您的指令相同的隔離範圍,因此ng-src不再有權訪問anObject,它位於父範圍內。

有時最簡單的選擇是將指令拆分成兩個單獨的元素,隔離範圍位於內部元素上。在你的情況下,我認爲在綁定中使用$parent.anObject.ImageUrl是最簡單的。

通常情況下,父範圍(從ng-repeat)的屬性在沒有通過原型繼承範圍的情況下可以訪問。隔離範圍沒有這種繼承,所以你需要明確地使用$parent來訪問它的屬性。