问题描述
我是用ionic的tab默认模板，然后需要加side menu这个功能，但是我在设置路由的时候不知该如何设置，是应该在tab下面接着这样写？
.state(’tab.login’,{ url:’/login’, views:{ ’tab-login’:{templateUrl:’templates/login.html’,controller:’LoginCtrl’ } } })
但是每次这样都会跳转到首页面，而只有title显示出来，内容区域号线被首页的盖住了，因此我新建了一个模板，为menu.html，我这样定义了路由
.state(’menu’,{ url:’/menu’, abstract:true, templateUrl: ’templates/menu.html’ }) .state(’tab’, { url: ’/tab’, abstract: true, templateUrl: ’templates/tabs.html’ }) // Each tab has its own nav history stack: .state(’tab.dash’, { url: ’/dash’, views: { ’tab-dash’: {templateUrl: ’templates/tab-dash.html’,controller: ’DashCtrl’ } } }) .state(’menu.login’,{ url:’/login’, views:{ ’menu-login’:{templateUrl:’templates/login.html’,controller:’LoginCtrl’ } } })
但是却没有了切换动画效果，这是什么原因？
问题解答
回答1：加个嵌套子路由应该就行了。
.state(’tab.dash’, { url: ’/dash’, abstract:true,//设为抽象 views: { ’tab-dash’: {templateUrl: ’templates/menu.html’,controller: ’MenuCtrl’ } } }) .state(’tab.dash.firstPage’, { url: ’/firstPage’, views: { ’side-menu’: {templateUrl: ’templates/firstPage.html’,controller: ’MyCtrl’ } } })$urlRouterProvider.otherwise(’/tab/dash/firstPage’);//跳转到首页
menu.html里的内容就是原来的side menu项目里menu.html模板，然后把视图名menuContent改成side-menu就行了。
