$ state.go不适用于嵌套状态 [英] $state.go not working for nested states

问题描述

下面描述的我的问题类似于这里描述为错误的问题: https://forum.ionicframework.com/t/blocker-bug-with-state-go-navigation/11036 但是，由于没有具体证据表明上述错误是一个错误，因此我在这里提出了这个问题.

My problem described below is similar to the problem described as a bug here : https://forum.ionicframework.com/t/blocker-bug-with-state-go-navigation/11036 But since there is no concrete evidence of the above being a bug that is I have raised this problem here.

我正在使用角度ui路由器在我的应用程序中进行路由，并且在同一应用程序中我面临一个非常奇怪的问题. 这是我的路由器配置

I am using angular ui router for routing in my app and I am faceing a very strange issue in the same. Here is my router config

 .state('test', {
    url: "/test",
    templateUrl     : "templates/session/finalprofile.html",
    controller      : 'LoginCtrl'
  }) 

 .state('login', {
    url: "/login",
    templateUrl     : "templates/mainLogin.html",
    controller      : 'LoginCtrl'
  })

 .state('app.feed', {
      url: '/feed',
      views: {
        'menuContent': {
          templateUrl: 'templates/feed.html',
          controller: 'PlaylistsCtrl'
        }
      }
    })

    .state('app.phabIssue', {
    url: '/phabIssue',
    views: {
      'menuContent': {
        templateUrl: 'templates/phabIssue.html',
        controller: 'Pabricatortrl'
      }
    }
  })

我的第一个视图是状态名称为"login"的登录视图，因此我位于"LoginCtrl"中.如您所见，这是一个非嵌套视图.
现在，当我使用$ state.go进行路由时.以下语句

My first view is the login view with state name 'login' so I am inside my 'LoginCtrl'. As you can see that this is a non nested view.
Now when I use $state.go for routing. The following statement

$ state.go('test')

$state.go('test')

有效，但

$ state.go('app.feed')

$state.go('app.feed')

不起作用.

我遇到以下错误

ionic.bundle.js:25642 TypeError:无法读取null的属性'@' 在updateView(ionic.bundle.js:62346) 在ionic.bundle.js:62337 在Scope.$ broadcast(ionic.bundle.js:29477) 在Object.load(ionic.bundle.js:49661) 在Object.injectables.$ template(ionic.bundle.js:49561) 在Object.invoke(ionic.bundle.js:17762) 在进行中(ionic.bundle.js:46577) 在调用时(ionic.bundle.js:46573) 在ionic.bundle.js:46552 在$ Resolve.resolve(ionic.bundle.js:46656)

ionic.bundle.js:25642 TypeError: Cannot read property '@' of null at updateView (ionic.bundle.js:62346) at ionic.bundle.js:62337 at Scope.$broadcast (ionic.bundle.js:29477) at Object.load (ionic.bundle.js:49661) at Object.injectables.$template (ionic.bundle.js:49561) at Object.invoke (ionic.bundle.js:17762) at proceed (ionic.bundle.js:46577) at invoke (ionic.bundle.js:46573) at ionic.bundle.js:46552 at $Resolve.resolve (ionic.bundle.js:46656)

类似地，我可以路由到任何未嵌套的状态.

Similarly I can route to any of the state which is not nested.

@jbrown.这是应用程序路线

@jbrown . This is the app route

  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'templates/menu.html',
    controller: 'AppCtrl',
    onEnter: function($state, Auth){
        if(!Auth.isLoggedIn()){
           $state.go('login');
        }
    }

  })

这是menu.html，我在其中添加了您的代码.

And this is the menu.html in which I have added your code.

<ion-side-menus enable-menu-with-back-views="false">
<div ui-view="menuContent"></div>

  <ion-side-menu-content>

    <ion-nav-bar class="bar-positive">
      <ion-nav-back-button class="button button-clear">
      <i class="ion-arrow-left-c"></i>
      </ion-nav-back-button>

      <ion-nav-buttons side="left">
        <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
        </button>
      </ion-nav-buttons>
    </ion-nav-bar>

    <ion-nav-view name="menuContent"></ion-nav-view>

  </ion-side-menu-content>

  <ion-side-menu side="left">
    <ion-header-bar class="bar-stable">
      <h1 class="title">App title</h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>
        <!-- <ion-item menu-close ng-click="login()"> -->
        <ion-item menu-close href="#/app/mainLogin">
          Login
        </ion-item>
        <ion-item menu-close href="#/app/feed">
          Feed
        </ion-item>
        <ion-item menu-close href="#/app/phabIssue">
          Phab
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

我犯了任何错误，还是这不是正确的路由方式或任何错误? 请帮助我解决这个问题.

Am I making any mistake or is this not the correct way of routing or any bug? Kindly help me solve this.

推荐答案

您需要像这样设置"app"的父视图和路线:

You need to set up the parent view and route for 'app' like this:

控制器

.state('app', {
  url: '/app',
  templateUrl: 'app.html'
})

添加包含ui-view指令的父视图.

Add a parent view incorporating the ui-view directive.

app.html

<div ui-view="menuContent"></div>

您可以在此有效的 plunk

这篇关于$ state.go不适用于嵌套状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！