如何访问templateUrl html内容中的angular指令的属性?
angular.module('myApp')
.directive('questionImage', function () {
return {
restrict : 'E',
scope : false,
templateUrl : 'templates/questionImage.html',
link : function(scope, element, attrs) {
scope.type = attrs['type'];
}
}
});
模板HTML:
<div>
<label>Image Links</label><br>
<button type="button" ng-click="newImageLink('{{type}}')">+</button>
<span ng-repeat="imageLink in questionFormData.imageUrls['{{type}}'] track by $index">
<input type="text" ng-model="questionFormData.imageUrls['{{type}}'][$index]">
<button type="button" ng-click="removeElement(questionFormData.imageUrls['{{type}}'], $index)">-</button>
</span>
</div>
在此HTML内,我需要访问在DOM中使用指令时指定的“类型”属性值,如下所示。
<question-image type="optionAImages"></question-image>
<question-image type="optionBImages"></question-image>
如何在模板html中获取“类型”属性值?
更新:在指令定义中添加了“链接”功能。我能够获取类型,但其值始终是最后一个指令用法。即我总是看到属性的optionBImages
值type
。optionAImages
值不可用。
问题来自scope:false
语句,因为问题图像指令的第二次调用覆盖了由相同参数的第一次调用更改的参数
您需要将其更改scope:false
为scope:true
这不会创建隔离的作用域,但会为指令赋予控制器父作用域的嵌套作用域。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句