Question

在我的案例中，似乎角度指令的范围对象“瘫痪”img src。如果我摘下scope: { myDirectiveText: "=" }，图片就会显示出来。有了它，图像就不显示了。

这是指令

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是=，＆amp;还是@都没关系 - 图像仍然无法显示。

我的印象是属性指令不会影响其指定元素的其他属性。我错过了什么或做错了什么？

Answer 1

这看起来像是隔离范围问题。在您的指令中将scope定义为哈希后，带有您的指令的元素上的所有属性现在都使用与您的指令相同的隔离范围，因此ng-src无法再访问anObject，它位于父范围内。

有时最简单的选择是将指令拆分为两个单独的元素，隔离范围位于内部元素上。在您的情况下，我认为在绑定中使用$parent.anObject.ImageUrl是最简单的。

通常，通过范围的原型继承，可以访问父范围（来自ng-repeat）的属性。隔离范围没有此继承，因此您需要显式使用$parent来访问它的属性。

角度指令范围与img src

1 个答案: