$location.path not routing correctly

@MatTaNg wrote:

I'm using the Ionic framework and I have a tabbed interface which uses routing with templates. For some reason no matter what URL I put into the $location.path it doesn't route to the correct place. I'm using the same URL I've been using before and I've never run into any problems so I don't understand why its not working.

Here is my tabs.html (Settings tab is not working):

<ion-tabs ng-controller = "tabs" class="tabs-icon-top tabs-color-active-positive">

  <!-- Articles Tab -->
  <ion-tab title="Articles" icon-off="ion-ios-paper-outline" icon-on="ion-ios-paper" href="#/tab/article">
    <ion-nav-view name="tab-article">
    </ion-nav-view>
  </ion-tab>

  <!-- Closets Tab -->
  <ion-tab title="Closet" icon-off="ion-ios-briefcase-outline" icon-on="ion-ios-briefcase" href="#/tab/closet">
    <ion-nav-view name="tab-closet"></ion-nav-view>
  </ion-tab>

  <!-- Settings Tab -->
  <ion-tab title="Settings" icon-off="ion-ios-gear-outline" icon-on="ion-ios-gear" on-select = "redirect()" ><!--href="#/tab/settings">-->
    <ion-nav-view name="tab-settings"></ion-nav-view>
  </ion-tab>

</ion-tabs>

Here is my controller (The redirect function gets called when the settings tab is selected):

.controller('tabs', function($scope, Settings, $rootScope, $location, $window) {

  $scope.redirect = function() {
    if($rootScope.loggedOn) {
      console.log("ASSDA");
        $window.location.href = "#/tab/logIn";
      //  $location.path("#/tab/logIn");

    }
    else {
      $window.location.href = "#/tab/logIn";
    //  $location.path("#/tab/logIn");


    }
  }
});

As you can see i've tried both $window.location.href and $locaion.path - both didn't work. When the Settings tab is selected it just defaults to the article tab. Once your on the articles page and you click back onto settings it defaults back to the article page but this time you get a blank page. It is hitting my console.log("ASSDA") so the if statement is returning true.

Here is how my routes are set up:

.config(function($stateProvider, $urlRouterProvider) {

  $stateProvider

  // setup an abstract state for the tabs directive
    .state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'templates/tabs.html'
  })

  // Each tab has its own nav history stack:

  .state('tab.article', {
    url: '/article',
    views: {
      'tab-article': {
        templateUrl: 'templates/tab-article.html',
        controller: 'articlesController'
      }
    }
  })

  .state('tab.closet', {
    url: '/closet',
    views: {
      'tab-closet': {
        templateUrl:'templates/tab-closet.html',
        controller: 'closetController'
      }
    }
  })

  .state('tab.settings', {
url: '/settings',
views: {
  'tab-settings': {
    templateUrl: 'templates/tab-settings.html',
    controller: 'settingsController'
  }
}
  })
  .state('tab.login', {
    url: '/login',
    templateUrl: 'templates/tab-login.html',
    controller: 'settingsController'
  });
  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/tab/article');

});

Posts: 1

Participants: 1

Read full topic