离子 - 查看永远不会被调用的事件 [英] Ionic - View Leave Events Never Called

查看:71
本文介绍了离子 - 查看永远不会被调用的事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

将现有的离子项目从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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆