正如 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 回答
问题是
$urlRouterProvider.otherwise()
指向/feed
时应该是/app/feed
,因为它在技术上是一个子状态 .