我正在尝试将超时传递给Angular JS中的bootstrap模式,以显示几个按钮并在单击其中一个时取消该超时
我正在尝试做的场景:我有一个sessión在3分钟后到期,所以在1.5分钟内,我向用户显示该模式,提示他是否要延长会话,如果他点击“确定” ,我取消超时并调用一个再次重置通知的功能。
如果我尝试使用Modal附带的解决方案传递它,则模式会在Timeout结束时启动,(我想这可能是因为它是一个承诺)
这不一定是解决方案,但这是我提出的,如果其他人有更好的方式或做法,我会很感激,如果你可以分享
JS
angular.module('app', ['ui.bootstrap'])
.controller('Main', MainCtrl);
MainCtrl.$inject = ['$modal', '$timeout'];
function MainCtrl($modal,$timeout) {
var vm = this;
vm.callModal = callModal;
/*vm.people = [
'Fred',
'Jim',
'Bob'
];*/
vm.time = $timeout(function() { // Timeout
alert("timeout ended");
}, 10000);
function callModal() {
$modal.open({
templateUrl: 'modal.html',
controller: ['$modalInstance', 'time', ModalCtrl],
controllerAs: 'vm',
resolve: {
time: function () { return vm.time; }
}
});
}
}
function ModalCtrl($modalInstance, time) {
var vm = this;
console.log(time);
}
主要
<body ng-controller="Main as vm">
<button type="button" class="btn btn-sm btn-primary" ng-click="vm.callModal()">Call modal</button>
</body>
模态
<div class="modal-header">
<h3 class="modal-title">Modal title</h3>
</div>
<div class="modal-body">
{{ vm.timeout }}
</div>
<div class="modal-footer">
<button class="btn" ng-click="$close()">Cancel</button>
</div>