I’d like to display popover inside the side menu component. Unfortunately calling the show()
method of the $ionicPopover
casues the side menu is closed. This has nothing to do with the menu-close
directive in the menu. Is there a way to prevent this action of closing and show the popover over the menu?
I have the problem too. When calling the model, the side menu will be also closed.Is there anyone have a solution?
I have the same issue!!! Has anyone solved the problem??
This happens when you use the “expose-aside-when” directive.
I submitted a pull request to ionic to fix this. Not sure when or if it will be merged, but In the meantime, I made this custom directive you can add to your project and use it instead of “expose-aside-when”. Your attribute will instead be “show-aside-when”. No other changes are necessary.
angular.module('you module name here').directive('showAsideWhen', ['$window', function($window) {
return {
restrict: 'A',
require: '^ionSideMenus',
link: function($scope, $element, $attr, sideMenuCtrl) {
// Setup a match media query listener that triggers a ui change only when a change
// in media matching status occurs
var mq = $attr.exposeAsideWhen == 'large' ? '(min-width:768px)' : $attr.showAsideWhen;
var mql = $window.matchMedia(mq);
mql.addListener(function (mql) {
onResize();
})
function checkAsideExpose() {
var mq = $attr.exposeAsideWhen == 'large' ? '(min-width:768px)' : $attr.showAsideWhen;
sideMenuCtrl.exposeAside($window.matchMedia(mq).matches);
sideMenuCtrl.activeAsideResizing(false);
}
function onResize() {
sideMenuCtrl.activeAsideResizing(true);
debouncedCheck();
}
var debouncedCheck = ionic.debounce(function() {
$scope.$apply(checkAsideExpose);
}, 300, false);
$scope.$evalAsync(checkAsideExpose);
}
};
}]);
1 Like