我需要在指令的视图中获取字符串值,虽然这应该是直截了当的,但它不起作用。
在调用该指令的视图中:
<hc-component-blocker animation="/images/spinner_black_16.gif"></hc-component-blocker>
指令:
angular.module('xnuapp')
.directive('hcComponentBlocker', function () {
return {
templateUrl: 'views/hccomponentblocker.html',
priority: 1005,
restrict: 'E',
replace: true,
scope: {
animation: '@'
},
controller: 'ComponentBlockerCtrl',
controllerAs: 'ComponentBlocker',
bindToController: true
};
});
指令的模板:
<div class="component-blocker" ng-if="!ComponentBlocker.thisComponentIsLoaded">
<img ng-src="{{ComponentBlocker.animation}}"/>
</div>
ComponentBlockerCtrl:
angular.module('xnuapp')
.controller('ComponentBlockerCtrl', function ($scope, HC_EVENTS) {
console.log(this.animation);
});
当我运行它时,我在控制台中得到了预期的字符串值(“/ images / spinner_black_16.gif”)。
但图像不显示。在HTML中呈现的内容是<div class="component-blocker ng-scope" ng-if="!ComponentBlocker.thisComponentIsLoaded" animation="/images/spinner_black_16.gif"><img></div>
我应该寻找什么?我认为这是将animation
的字符串值输入控制器和视图的模型。为什么视图没有获得传递给它的属性的值?
答案 0 :(得分:0)
通过将replace
更改为false
来解决此问题。我不完全确定为什么会这样,但确实如此。