我一直在尝试为模式创建指令,但我发现一旦指令模板初始化,通过 UI 进行的进一步更改将不会导致它更新。这是每次都显示的第一个缓存版本。
这是我的指令代码:
'use strict';
angular.module('sample')
.directive('modalPage', function ($timeout) {
return {
restrict: 'E',
templateUrl: 'directives/sampleTemplate.html',
scope: {
data: '='
},
link: build
};
function build(scope, element, attrs) {
scope.initData = function () {
// does something that changes the value of var
};
scope.$watch('data', function (value) {
if (value) {
scope.initData();
}
}, true);
}
});
我的模板 sampleTemplate.html 看起来像这样:
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-body" style="padding:5px!important;">
<div class="card card-6">
<div class="card-heading">
<h2 class="title">{{ var }}</h2>
</div>
<div class="card-footer"></div>
</div>
</div>
</div>
</div>
该指令首先会渲染模板页面(当 var 的值没有改变时),然后 UI 交互导致数据发生变化,调用 initData 并为 var 分配一个新值。模态仍然显示 var 的旧值。
我尝试使用 $compile() 并为更改 var 设置超时,但都没有奏效。之前的所有讨论也没有奏效。任何帮助表示赞赏。先感谢您!