I am developing an android application using cordova and ionic framework.I am side menus and tab menus for navigation .How can use a tab menu in page which is loaded using a side menu.Here is app.js file
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: "/app",
abstract: true,
templateUrl: "templates/menu.html",
controller: 'AppCtrl'
})
/*--------------------menus in sidebar----------------------------------------------*/
.state('app.home', {
url: "/home",
views: {
'menuContent' :{
templateUrl: "templates/home.html",
controller: 'homeCtrl'
}
}
})
.state('app.announcements', {
url: "/announcements",
views: {
'menuContent' :{
templateUrl: "templates/announcements.html",
controller:'announcementCtrl'
}
}
})
.state('app.deals', {
url: "/deals",
views: {
'menuContent' :{
templateUrl: "templates/deals.html",
controller:'dealsCtrl'
}
}
})
.state('app.dining', {
url: "/dining",
views: {
'menuContent' :{
templateUrl: "templates/dining.html",
controller:'diningCtrl'
}
}
})
.state('app.director', {
url: "/director",
views: {
'menuContent' :{
templateUrl: "templates/director.html"
}
}
})
.state('app.contact', {
url: "/contact",
views: {
'menuContent' :{
templateUrl: "templates/contact.html"
}
}
})
.state('app.about_app', {
url: "/about_app",
views: {
'menuContent' :{
templateUrl: "templates/about_app.html"
}
}
})
.state('app.quiz_register', {
url: "/quiz_register",
views: {
'menuContent' :{
templateUrl:'templates/register.html',
controller:'RegisterCtrl'
}
}
})
.state('app.quiz_web', {
url: "/quiz_web",
views: {
'menuContent' :{
templateUrl:'templates/registermodel.html',
controller:'WebCtrl'
}
}
})
/*----------------------------------menus in sidebar--------------------------------------------*/
/*----------------------------------menus in homepage--------------------------------------------*/
.state('app.about_gksf', {
url: "/about_gksf",
views: {
'menuContent' :{
templateUrl: "templates/about_gksf.html"
}
}
})
.state('app.culture', {
url: "/culture",
views: {
'menuContent' :{
templateUrl: "templates/culture.html"
}
}
})
.state('app.sponsors', {
url: "/sponsors",
views: {
'menuContent' :{
templateUrl: "templates/sponsors.html"
}
}
})
.state('app.gallery', {
url: "/gallery",
views: {
'menuContent' :{
templateUrl: "templates/gallery.html",
controller:'galleryCtrl'
}
}
})
/*---------------------------------menus in homepage----------------------------------------*/
/*---------------------------------ANNOUNCEMENT ITEM----------------------------------------*/
.state('app.announcementsitem', {
url: "/announcementsitem/:itemId",
views: {
'menuContent' :{
templateUrl: "templates/announcementsitem.html",
controller:'announcementdetailCtrl'
}
}
})
/*---------------------------------ANNOUNCEMENT ITEM----------------------------------------*/
/*---------------------------------DEALS ITEM----------------------------------------*/
.state('app.dealsitem', {
url: "/dealsitem/:dealId",
views: {
'menuContent' :{
templateUrl: "templates/dealsitem.html",
controller:'dealsdetailsCtrl'
}
}
})
/*---------------------------------DEALS ITEM----------------------------------------*/
/*---------------------------------DINING ITEM----------------------------------------*/
.state('app.diningitem', {
url: "/diningitem/:diningId",
views: {
'menuContent' :{
templateUrl: "templates/diningitem.html",
controller:'diningdetailCtrl'
}
}
})
/*---------------------------------DINING ITEM----------------------------------------*/
.state('app.single', {
url: "/playlists/:playlistId",
views: {
'menuContent' :{
templateUrl: "templates/playlist.html",
controller: 'PlaylistCtrl'
}
}
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/app/home');
});
This is what i am trying to do
1.When i click the side menu QUIZ quiz page is loaded
2.Here i want use the TAB menu