CODEWITHSUNDEEP
angularjsionic-frameworkionic-view
CannotCode
CannotCode

Reputation: 125

Ionic views not switching

I am implementing a single page ionic/cordova application and trying to use ion-views. I have searched in every corner of the internet, tried one million solutions and nobody seems to have same problem as mine. My problem is: whenever I try to switch from one view to another, instead of replacing the old view, the new view is being appended. As a result I have a page with several views mixed up together.

In my index.html I use this code: 

<body ng-app="garage">
<ion-header-bar class="bar-stable">
   .....
</ion-header-bar>

<ion-nav-view></ion-nav-view>

<ion-footer-bar class="bar bar-footer" ng-controller="AppCtrl"
ng-hide="isActive('/home') || isActive('/reg')">
   .......
</ion-footer-bar>
</body>

The code in my HomeCtrl that tries to redirect to another view:

$location.path('main');

My app.js file:

angular.module('garage', ['ionic', 'angularGrid', 'ngRoute', 'ngCordova','ui.bootstrap']).run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
  cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
  cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
  StatusBar.styleDefault();
}
});
}).config(function($stateProvider, $urlRouterProvider){
$stateProvider
.state('home', {
  url: '/home',
  templateUrl: 'partials/home.html',
  controller: 'HomeCtrl'
})
.state('main', {
  url:'/main',
  templateUrl: 'partials/main.html',
  controller: 'MainCtrl'
});
$urlRouterProvider.otherwise('/home');
});

Any help will be appreciated.

Upvotes: 0

Views: 46

Answers (1)

AnatolyS
AnatolyS

Reputation: 4319

At first ensure that your project depends on 'ui.router' module. At second use $state.go instead of modify location just for clarity.

Upvotes: 3

Related Questions