I am a newbie to angular JS and IONIC.
I have left side menu: - Menu 1 - Menu 2 - Menu 3
And right side menu dynamically change based on the selected left menu.
I successfully did this. But, the problem is when i change to other Menu, my right side menu won't be updated before i refresh the page (using F5).
Whats wrong with my code:
controller.js
angular.module('starter.controllers', []) .controller('AppCtrl', function ($state, $scope, $stateParams) { var source = $stateParams.source; $scope.title = source; $scope.data = {items: []}; if (source == 'Menu1') { $scope.data.items.push({url: source + '/AAA', label: "AAA"}); $scope.data.items.push({url: source + '/BBB', label: "BBB"}); $scope.data.items.push({url: source + '/CCC', label: "CCC"}); } if (source == 'Menu2') { $scope.data.items.push({url: source + '/EEE', label: "EEE"}); } if (source == 'Menu3') { $scope.data.items.push({url: source + '/FFF', label: "FFF"}); } }) .controller('NewsListCtrl', function ($scope, $stateParams) { }) ; app.js
.config(function ($stateProvider, $urlRouterProvider) { $stateProvider .state('app', { url: "/app/:source/:channel", templateUrl: "templates/layout.html", controller: 'AppCtrl' }) .state('app.newsList', { url: "/news-list", views: { 'menuContent': { templateUrl: "templates/news-list.html", controller: 'NewsListCtrl' } } }) // if none of the above states are matched, use this as the fallback $urlRouterProvider.otherwise('/app/Menu1/AAA/news-list'); }); layout.html
<ion-side-menus enable-menu-with-back-views="false">> <ion-side-menu-content> ... </ion-side-menu-content> <ion-side-menu side="left"> <ion-content> <ion-list> <ion-item menu-close href="#/app/Menu1/AAA/news-list"> AAA </ion-item> <ion-item menu-close href="#/app/Menu2/EEE/news-list"> EEE </ion-item> <ion-item menu-close href="#/app/Menu3/FFF/news-list"> FFF </ion-item> </ion-list> </ion-content> </ion-side-menu> <ion-side-menu side="right"> <ion-content> <ion-list> <ion-item menu-close ng-repeat="item in data.items" href="#/app/{{item.url}}/news-list"> {{item.label}} </ion-item> </ion-list> </ion-content> </ion-side-menu> </ion-side-menus> 
