I'm using angular-ui modal in my webapp. one of models display many links (anchor elements) that navigate to various parts of the app. the modal can be closed as usual with modal.dismiss() or modal.close(). but I need it to close when someone navigate out of it with clicking an anchor? usually (not angular) I could just attach an event to all the anchor clicks and close the modal from there. but in angular It seems somewhat complicated and not very "angularish" - Any ideas/directions on how to implement this?
我在我的webapp中使用angular-ui模式。其中一个模型显示了许多链接(锚点元素),它们导航到应用程序的各个部分。但是当有人通过点击一个锚点来导航时,我需要它关闭吗?通常(不是角的)我可以将一个事件附加到所有锚点上并从那里关闭模式。但从角度上看,它似乎有点复杂,不太“棱角分明”——关于如何实现这一点有什么想法和方向吗?
e.g: I'm using angular-ui-router so if this can be solved through the routes It would also solve my problem.
e。旅客:我正在使用angular-ui-router,如果这能通过路由解决的话,它也能解决我的问题。
Thanks!
谢谢!
2 个解决方案
#1
3
Angular-ui-router fires events when a state change has occurred, so in your controller you could do something like:
当发生状态更改时,angular -ui-路由器触发事件,所以在控制器中可以执行如下操作:
$scope.currentModal = undefined;
// whenever a modal opens, ensure it is assigned to the $scope.currentModal. Not clear how
// you are managing your modals at the moment.
// this event-listener closes the current modal (if any)
$scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
if ($scope.currentModal) {
$scope.currentModal.dismiss();
}
})
#2
0
Use $modalStack.dismissAll() to close any modalbox when state changes.
使用$modalStack.dismissAll()在状态改变时关闭任何modalbox。
angular.module('myApp').controller('AppCtrl', ['$scope', '$rootScope', '$modal', '$modalStack',
function ($scope, $rootScope, $modal, $modalStack) {
$rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams, options){
$modalStack.dismissAll();
});
}
]);
#1
3
Angular-ui-router fires events when a state change has occurred, so in your controller you could do something like:
当发生状态更改时,angular -ui-路由器触发事件,所以在控制器中可以执行如下操作:
$scope.currentModal = undefined;
// whenever a modal opens, ensure it is assigned to the $scope.currentModal. Not clear how
// you are managing your modals at the moment.
// this event-listener closes the current modal (if any)
$scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
if ($scope.currentModal) {
$scope.currentModal.dismiss();
}
})
#2
0
Use $modalStack.dismissAll() to close any modalbox when state changes.
使用$modalStack.dismissAll()在状态改变时关闭任何modalbox。
angular.module('myApp').controller('AppCtrl', ['$scope', '$rootScope', '$modal', '$modalStack',
function ($scope, $rootScope, $modal, $modalStack) {
$rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams, options){
$modalStack.dismissAll();
});
}
]);