Javascript 组件模板关闭后将被删除
我创建了一个“通知”组件,它基本上在任务完成时进行通知。它有一个关闭按钮,允许用户在看到通知后关闭通知。我面临的问题是,一旦用户单击关闭按钮,“通知”组件模板就会被删除。因此,无法看到进一步的通知 组件:notification.js ```Javascript 组件模板关闭后将被删除,javascript,angularjs,Javascript,Angularjs,我创建了一个“通知”组件,它基本上在任务完成时进行通知。它有一个关闭按钮,允许用户在看到通知后关闭通知。我面临的问题是,一旦用户单击关闭按钮,“通知”组件模板就会被删除。因此,无法看到进一步的通知 组件:notification.js ``` angular .module("app") .component("notification", { bindings: { notificationType: "@", n
angular
.module("app")
.component("notification", {
bindings: {
notificationType: "@",
notificationMessage: "@",
notificationCloseCallBack: "&"
},
controller: function($scope, $rootScope) {
var vm = this;
vm.notificationCssStyle = {
"info": "pficon-info",
"success": "pficon-ok",
"warning": "pficon-warning-triangle-o",
"danger": "pficon-error-circle-o"
}
vm.closeNotification = function() {
vm.notificationCloseCallBack();
};
},
controllerAs: "vm",
template: "<div ng-show='vm.notificationMessage.length' class='toast-pf alert alert-{{vm.notificationType}} alert-dismissable'>" +
"<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>" +
"<span class='pficon pficon-close' ng-click='vm.closeNotification()'></span>" +
"</button>" +
"<span class='pficon {{vm.notificationCssStyle[vm.notificationType]}}'></span>" +
"{{vm.notificationMessage}}" +
"</div>"
});
<span class="pull-right">
<notification notification-type="{{$root.notification.type}}" notification-message="{{$root.notification.message}}" notification-close-call-back="header.notificationClose()"></notification>
</span>
angular
.module("app")
.component("header", {
restrict: "E",
templateUrl: "/modules/base/header/header.html",
bindings: {
isNavigationShow: "="
},
controller: headerController,
controllerAs: "header"
});
/*@ngInject*/
function headerController($rootScope, $state, $scope, utils) {
var vm = this;
vm.notificationClose = notificationClose;
$rootScope.notification = {
"type": "",
"message": ""
};
function notificationClose() {
$rootScope.notification.type = "";
$rootScope.notification.message = "";
}
}