首页 文章

当与ui-router子状态组合时,离子离子侧菜单产生空白页

提问于
浏览
0

正如 Headers 所述,我在使用Angular ui-router和 ion-side-menus 时遇到了问题 . 我似乎认出了我的问题 .

在我将基本状态加载到ion-nav-view而不使用父状态之前,会显示侧栏 . 但是当我改变状态时,侧栏停止工作 . 由于添加父状态 app 并使 feed 成为它的子项,我的应用程序显示一个完全空白的屏幕,并且没有从任一控制器运行任何代码 .

index.html 开始,我的body标签只是 <ion-nav-view> 标签:

<body>
  <ion-nav-view></ion-nav-view>
</body>

menu.html 包含侧栏菜单的html:

<ion-side-menus>
  <ion-pane ion-side-menu-content>
    <ion-nav-bar class="bar-stable">
      <ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> Back</ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
  </ion-pane>
  <ion-side-menu side="left">
    <header class="bar bar-header bar-stable">
      <h1 class="title">Left</h1>
    </header>
    <ion-content class="has-header">
      <ion-list>
        <ion-item nav-clear menu-close>
          Tab 1
        </ion-item>
        <ion-item nav-clear menu-close>
          Tab 2
        </ion-item>
        <ion-item nav-clear menu-close>
          Some tab
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

最后,将事物联系在一起的部分是路由器:

function config($ stateProvider,$ urlRouterProvider,$ locationProvider){

$urlRouterProvider.when('', '/feed');
$urlRouterProvider.otherwise('/feed');

$stateProvider
  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'views/menu/menu.html',
    controller: 'MenuController'
  })

$stateProvider
  .state('app.feed', {
    url: '/feed',
    views: {
      'menuContent': {
        templateUrl: 'views/feed/feed.html',
        controller: 'FeedController',
        controllerAs: 'ctrl',
        authenticate: true
      }
    }
  });

//Other states

我感谢任何人都能提供的见解!

1 回答

  • 0

    问题是 $urlRouterProvider.otherwise() 指向 /feed 时应该是 /app/feed ,因为它在技术上是一个子状态 .

相关问题