我想构建一个使用选项卡界面和侧面菜单进入状态的应用程序 .
现在我想要的是侧面菜单链接视图在其选定的选项卡下也有原始选项卡,一旦在这些新视图上 .
router.js
function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: "/app",
abstract: true,
templateUrl: "js/base/menu.html"
})
.state('app.tabs', {
url: '/tabs',
views: {
'menuContent': {
templateUrl: 'js/base/tabs.html',
controller: 'TabsController as tabsController'
}
}
})
.state('app.tabs.old', {
url: '/old',
views: {
'old': {
templateUrl: 'js/old/old.html',
}
}
})
.state('app.tabs.new', {
url: '/new',
views: {
'new': {
templateUrl: 'js/new/new.html',
}
}
})
.state('app.tabs.profile', {
url: '/profile',
views: {
'profile': {
templateUrl: 'js/profile/profile.html'
}
}
});
$urlRouterProvider.otherwise('/app/tabs');}
这里 old 和 new 在选项卡中,而 profile 应该从侧边菜单访问,并且在其视图底部还有新旧选项卡 .
menu.html
<ion-side-menus enable-menu-with-back-views="false">
<ion-side-menu-content>
<ion-nav-bar class="header-style">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view name="menuContent"></ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="right">
<ion-content>
<ion-list>
<!--THE MOST IMPORTANT PART-->
<ion-item nav-clear class="item item-avatar" href="#/profile">
<img src="../images/img/avatar/header-avatar-2.png">
<h2 class="item-text-center">{{user}}'s Profile</h2>
</ion-item>
</ion-list>
</ion-content>
</ion-side-menu>
</ion-side-menus>
现在最重要的是离子项,我尝试了一切,从
-
href
-
onclick
-
ng-点击进入状态
-
ui-sref
显然没有做对 .
有关如何将配置文件视图连接到应用程序的任何建议?