Ionic -查看从未调用的休假事件

wbrvyc0a  于 2022-12-08  发布在  Ionic
关注(0)|答案(5)|浏览(153)

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>
kokeuurv

kokeuurv1#

如果使用<ion-tab>将视图 Package 在选项卡中,则需要注册$ionicNavView-Events:

$scope.$on("$ionicNavView.leave")
5cg8jx4n

5cg8jx4n2#

这是一个未决问题https://github.com/driftyco/ionic/issues/2869,可能在view-cache ="false"时发生。
在我的例子中,$ionicView.leave在嵌套视图中工作,但在标签之间移动时不工作,$ionicParentView.leave也不工作,所以我用另一个解决方案来解决它。

    • 解决方案:**在主控制器上,我添加了:
$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') 

     }
});

希望能有所帮助

vc9ivgsu

vc9ivgsu3#

I had this problem the other day. I was listening for the event on my child controllers. When I moved the listener to the parent, it worked. I wasn't quite sure why, but now I think I know why. It's because of the way Ionic caches the views. Specifically this line from the docs:
If a view leaves but is cached, then this event will not fire again on a subsequent viewing.
It's likely that your views were cached before you added the listener and the leave event never fired. But since your parent is... well... the parent, its leave event is triggered any time you leave any of its children. I haven't officially tested this, it's just a hunch. To test, try telling ionic to not cache the view by adding cache-view="false" to your ion-view declaration.
See docs here .

cdmah0mi

cdmah0mi4#

Found the problem. The 'Main' state was defined without the attribute

abstract: true

this worked in Ionic 1.13-beta but Aparently breaks in Ionic 1.14-beta. Didn't find this change in any of the migration posts on either Ionic, AngularJS or Angular-ui-router, so I don't know why this solved it. If anyone can elaborate more on the behavior in this situation, I'd be grateful but for now I have a solution.

92vpleto

92vpleto5#

我知道这是相当老的,但我想补充的是,在Ionic v1.3.4(最后一个版本)的$ionicView.beforeEnter && $ionicView.afterEnter都工作。我提到这一点,因为其他人已经评论说,v1.3.x有问题的控制器视图的.beforeEnter and .afterEnter。但我不记得有任何问题的1.3.x版本。
话虽如此,我来到这个主题是因为我正在更新一个旧的ionic v1应用程序,遇到了一个问题,即$ionicView.beforeEnter没有启动,我不知道为什么。结果是与该控制器配套的模板在一些<i class="icon>元素上缺少结束HTML标记...我没有添加结束</i>
因此,很明显,某些元素缺少结束标记会阻止控制器$ionicView.beforeEnter/afterEnter函数的触发。不知道是所有标记还是特定标记,但我可以说我从来没有见过,所以我花了一段时间才发现问题出在我的模板中,而不是我的控制器中。
不管它有什么价值,希望我的发现能在未来帮助那些人。

相关问题