Ionic $state.go 在设备上不起作用

Posted 2023-02-19

【中文标题】Ionic $state.go 在设备上不起作用

【英文标题】：Ionic $state.go not working on device

【发布时间】：2015-08-12 08:36:21

【问题描述】：

我目前正在开发一个应用程序，使用 Ionic 构建。我的问题是 $state.go 只能在浏览器中运行，而不能在手机上运行。这似乎是一个常见问题，但是在阅读了很多相同问题的答案后，我仍然无法弄清楚如何解决它。

一般的修复方法似乎是确保您使用相对 URL，如下所述：Using Angular UI-Router with Phonegap 但我仍然无法让它工作。我错过了什么？

plunker 链接：http://plnkr.co/edit/qFJ1Ld6bhKvKMkSmYQC8?p=preview

App.js 结构：

    ....
    $stateProvider
      .state('parent', 
      url: "/",
      templateUrl: "parent.html"
    )
    .state('parent.child', 
      url: "child",
      templateUrl: "child.html"
    )
    $urlRouterProvider.otherwise("/")
    )
    ....

【问题讨论】：

你试过在函数中做 $state.go 吗？

还没有 - 将尝试这样做！

我更新了 plunker 以便 $state.go 在“菜单 1”的函数中。在设备上对其进行测试时，它仅在单击菜单后滑动或向下滑动后才会出现。所以场景是这样的，我单击菜单 1 - 没有任何反应 - 向上或向下滑动，然后出现视图。我使用 Ionic View 在移动设备上对其进行了测试

【参考方案1】：

要让 state.go 工作，你必须将 $state 依赖注入你的控制器

app.controller('ParentCtrl', ['$scope', '$state', function($scope, $state) 
  $scope.$state = $state
]);

app.controller('MenuCtrl', ['$scope', '$state', function($scope, $state)

    $scope.goTo = function()
        $state.go('menu.kategorier');
    

]);

你必须在 $stateProvider 中注册你想要去的状态

$stateProvider
.state('menu.kategorier', ...)

在这种情况下，您必须从父状态（如“菜单”）进入该状态。您不能将状态从“父”更改为“menu.kategorier”，但您可以从“父”转到“父子”

【讨论】：

“menu.kategorier”是复制粘贴错误。因为这是我在设备上测试时使用的。为了让 plunker 更简单，我使用了 parent.child。因此，在测试它时，我使用了正确的 $stateProvider。

忘记补充了，更正控制器中的 $state 依赖项似乎并不能解决问题，我必须在单击菜单后滑动才能显示视图。

【参考方案2】：

我通过更改嵌套视图的设置解决了这个问题，基于此示例：http://codepen.io/mhartington/pen/Bicmo

这里是我的plunker，有兴趣的人：

Plunker：http://plnkr.co/edit/2m5bljMntpq4P2ccLrPD?p=preview

app.js 结构：

    $stateProvider
      .state('eventmenu', 
      url: "/event",
      abstract: true,
      template: "<ion-nav-view name='menuContent'></ion-nav-view>"
      )

      .state('eventmenu.home', 
      url: "/home",
      views: 
        'menuContent' :
          templateUrl: "home.html"
        
      
     )

     .state('eventmenu.home.home1', 
     url: "/home1",
     views: 
       'inception' :
         templateUrl: "home1.html"
       
     
    )