离子 - 查看永远不会被调用的事件 [英] Ionic - View Leave Events Never Called
问题描述
将现有的离子项目从1.13-beta更新为1.14-beta后,我遇到了一些我无法解释的行为。从一个视图状态更改为另一个视图状态时,旧视图不会离开页面。在记录角度ui路由器事件和离子导航事件时,我注意到Ionic的退出事件未被触发:
$ ionicView。离开
$ ionicView.beforeLeave
$ ionicView.afterLeave
文档:(< a href =http://ionicframework.com/blog/navigating-the-changes/ =noreferrer> http://ionicframework.com/blog/navigating-the-changes/ ) p>
有没有其他人经历过类似的行为?如果是这样,你有没有办法解决这个问题?
事件被解雇:
$ stateChangeStart:App.LoadApp.Input - > App.Main.QrToken
$ viewContentLoading:Main
$ viewContentLoading:QrToken
$ stateChangeSuccess:App.LoadApp.Input - > App.Main.QrToken
$ ionicView.beforeEnter
$ ionicView.afterEnter
$ ionicView.enter
如果我不将它嵌入Main中,我可以在QrToken视图中加载,所以我相信问题就在那里。任何人都可以查看我的主模板并帮我找到解决方案。
< div ng-controller =fbMenuController >
< ion-side-menus>
<! - 左菜单 - >
< ion-side-menu side =left>
< ion-header-bar class =bar-dark>
< h1 class =title>菜单< / h1>
< / ion-header-bar>
< ion-content scroll =true>
< div ng-repeat =fb.Model.MenuGroups中的组>
< ion-item class =item-divider> {{Group.Name}}< / ion-item>
<! - href =#/ Main / {{Page.Name}} - >
< a ng-repeat =Group.Items中的页面nav-transition =androidnav-direction =swapclass =itemng-click =fb.SelectPage(Page.State) >
{{Page.Name}}
< / a>
< / div>
< / ion-content>
< / ion-side-menu>
<! - 中心内容 - >
< ion-side-menu-content>
< ion-header-bar class =bar-darkng-show =fb.Model.ShowHeader>
< div class =buttons>
< button class =button-icon icon ion-naviconng-click =fb.ToggleLeftMenu()>< / button>
< / div>
< h1 class =title> {{fb.Model.ActivePage.Name}}< / h1>
< / ion-header-bar>
< ion-content scroll =true>
< ion-nav-view name =Main>
< / ion-nav-view>
< / ion-content>
< / ion-side-menu-content>
< / ion-side-menus>
< / div>
这是一个未解决的问题 https://github.com/driftyco/ionic/issues/2869 并且可能在view-cache =时发生false。
在我的情况下 $ ionicView.leave
在嵌套视图中工作,但在选项卡之间移动时没有 $ ionicParentView.leave
所以我用另一个解决方案解决了这个问题。
解决方案:
在MAIN控制器上我添加了:
$ rootScope。$ on('$ stateChangeStart',function(event,toState) ,toParams,fromState,fromParams){
if(fromState.name ==='name-of-leave-state'){
//这里的代码,与。$类似的行为on('$ ionicView.leave')
}
});
希望有所帮助
After updating an existing Ionic project from 1.13-beta to 1.14-beta I've experienced some behaviour I can't explain. When changing from one viewstate to another, the old view doesn't leave the page. Upon logging both angular ui router events and Ionic navigation events I've noticed Ionic's Exit Events aren't fired:
$ionicView.leave
$ionicView.beforeLeave
$ionicView.afterLeave
Documentation: (http://ionicframework.com/blog/navigating-the-changes/)
Has anyone else experienced similar behaviour? If so, have you found any way to resolve this?
Events Fired:
$stateChangeStart: App.LoadApp.Input -> App.Main.QrToken
$viewContentLoading: Main
$viewContentLoading: QrToken
$stateChangeSuccess: App.LoadApp.Input -> App.Main.QrToken
$ionicView.beforeEnter
$ionicView.afterEnter
$ionicView.enter
I can load in the QrToken view if I Don't nest it inside Main, so I believe the problem lie there. Can anyone take a look at my Main Template and help me find a solution.
<div ng-controller="fbMenuController">
<ion-side-menus>
<!-- Left menu -->
<ion-side-menu side="left">
<ion-header-bar class="bar-dark">
<h1 class="title">Menu</h1>
</ion-header-bar>
<ion-content scroll="true">
<div ng-repeat="Group in fb.Model.MenuGroups">
<ion-item class="item-divider">{{Group.Name}}</ion-item>
<!-- href="#/Main/{{Page.Name}}" -->
<a ng-repeat="Page in Group.Items" nav-transition="android" nav-direction="swap" class="item" ng-click="fb.SelectPage(Page.State)">
{{ Page.Name }}
</a>
</div>
</ion-content>
</ion-side-menu>
<!-- Center content -->
<ion-side-menu-content>
<ion-header-bar class="bar-dark" ng-show="fb.Model.ShowHeader">
<div class="buttons">
<button class="button-icon icon ion-navicon" ng-click="fb.ToggleLeftMenu()"></button>
</div>
<h1 class="title">{{ fb.Model.ActivePage.Name }}</h1>
</ion-header-bar>
<ion-content scroll="true">
<ion-nav-view name="Main">
</ion-nav-view>
</ion-content>
</ion-side-menu-content>
</ion-side-menus>
</div>
This is an open issue https://github.com/driftyco/ionic/issues/2869 and probably occurs when view-cache="false".
On my case $ionicView.leave
worked in nested views but not when moving between tabs nor did $ionicParentView.leave
so I came around it with another solution.
Solution: On MAIN controller I added:
$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
if (fromState.name === 'name-of-leaving-state') {
//your code here, similar behavior with .$on('$ionicView.leave')
}
});
Hope it helps
这篇关于离子 - 查看永远不会被调用的事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!