我的一个自定义指令(alert-animate)没有显示出现问题。
popinState
更改为inprogress
并返回update
后,会出现此问题。不知何故,自定义指令没有显示......
我调试了应用程序,确实调用了指令的链接功能。我无法弄清楚为什么指令没有显示出来......
alert-animate指令定义:
(function () {
angular.module('commonModule').directive('alertAnimate', function ($animate, $timeout, $rootScope) {
return {
restrict : 'E',
replace : true,
scope : {
type : '@',
zone : '@',
timeout : '@'
},
link : function (scope, iElement) {
// if there is no timeout defined, we fix it to 5 second
if (angular.isUndefined(scope.timeout)) {
scope.timeout = 5000;
}
$rootScope.$on(scope.zone + '::' + scope.type, function (e, message) {
// Create alert div
var messageElement = angular.element('<div class="alert alert-' + scope.type + '"></div>');
messageElement.append(message);
iElement.empty();
iElement.append(messageElement);
// create animation after the delay
$timeout(function () {
$animate.leave(messageElement);
}, scope.timeout);
});
}
};
});
})();
在ng-if指令中使用alert-animate:
<div ng-if="popinState['save-mappings'] === 'update'">
<div class="modal-body">
<fieldset class="marginb">
<legend>Modifier</legend>
<alert-animate type="danger" zone="POPIN_SAVE"></alert-animate>
...
</div>
</div>
<div ng-if="popinState['save-mappings'] === 'inprogress'">
<div class="modal-body">
<uib-progressbar min="0" max="100" value="100" class="progress-striped active">Le mapping est en cours d'enregistrement...</uib-progressbar>
</div>
</div>
这是错误消息的显示方式:
$scope.showErrorMessage = function (zone, message) {
$rootScope.$broadcast(zone + '::danger', message);
};
修改:标记<alert-animate type="danger" zone="POPIN_SAVE"></alert-animate>
确实显示在Chrome控制台的来源中,但它是未显示的错误消息。