Angularjs $location.path未路由到正确的页面

我使用的是Ionic框架，我有一个选项卡式界面，它使用带模板的路由。出于某种原因，无论我将哪个URL放入$location.path，它都不会路由到正确的位置。我使用的是我以前使用过的同一个URL，我从来没有遇到过任何问题，所以我不明白为什么它不起作用

这是my tabs.html（设置选项卡不工作）：

如您所见，我尝试了$window.location.href和$locaion.path，但都不起作用。当选择“设置”选项卡时，它只是默认为“文章”选项卡。当您的页面进入文章页面并单击“返回设置”后，它将默认返回到文章页面，但这一次您将得到一个空白页面。它正在访问我的console.log（“ASSDA”），因此if语句返回true

以下是如何设置我的路线：

.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');

});

---

app.js

var app = angular.module('ionicApp', ['ionic'])
app.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise("/tab/article");
    $stateProvider
        .state('tab', {
            url: '/tab',
            templateUrl: 'tab.html',
            abstract: true
        }).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'
                }
            }
        })

})
.controller('articlesController', function($scope) {})
.controller('closetController', function($scope) {})
.controller('settingsController', function($scope) {})

在index.html中添加代码

<ion-nav-bar class="bar-energized nav-title-slide-ios">
</ion-nav-bar>
<ion-nav-view></ion-nav-view>

<script id="tab.html" type='text/ng-template'>
    <ion-tabs class="tabs-icon-top tabs-color-active-positive">

        <ion-tab title="Articles" icon-off="ion-ios-paper-outline" icon-on="ion-ios-paper" ui-sref="tab.article">
            <ion-nav-view name="tab-article">
            </ion-nav-view>
        </ion-tab>

        <ion-tab title="Closet" icon-off="ion-ios-briefcase-outline" icon-on="ion-ios-briefcase" ui-sref="tab.closet">
            <ion-nav-view name="tab-closet"></ion-nav-view>
        </ion-tab>

        <ion-tab title="Settings" icon-off="ion-ios-gear-outline" icon-on="ion-ios-gear" ui-sref="tab.settings">
            <ion-nav-view name="tab-settings"></ion-nav-view>
        </ion-tab>

    </ion-tabs>

</script>

<script id='templates/tab-article.html' type='text/ng-template'>
    <ion-view title="Articles Page">
        <ion-content>
            Articles page
        </ion-content>
    </ion-view>
</script>

<script id='templates/tab-closet.html' type='text/ng-template'>
    <ion-view title="Closet Page">
        <ion-content>
            Closet page
        </ion-content>
    </ion-view>
</script>

<script id='templates/tab-settings.html' type='text/ng-template'>
    <ion-view title="Settings Page">
        <ion-content>
            Settings page
        </ion-content>
    </ion-view>
</script>

文章页
壁橱页
设置页面

---

我发现了这一点，实际上我需要在我的tabs.html中添加另一个隐藏的登录选项卡。我猜它是在寻找一个不存在的登录标签——将它添加到tabs.html修复了它。因此，这将是：

  <ion-tab title="LogIn" hidden="true">
      <ion-nav-view name="tab-logIn"></ion-nav-view>
  </ion-tab>

使用$state.go（'stateName'，（{}））看起来$state.go（）更改了URL，但没有重新加载页面。我试图在之后抛出$rootScope.$apply（），但它抛出了一个异常“$apply ready in progress”。有什么想法吗？你能在plunker中创建这个吗？以前用过它，但我会看看我能做什么。我想plunker不会识别离子标签吧？当我复制我的代码时，我总是得到一个白色的屏幕

<ion-nav-bar class="bar-energized nav-title-slide-ios">
</ion-nav-bar>
<ion-nav-view></ion-nav-view>

<script id="tab.html" type='text/ng-template'>
    <ion-tabs class="tabs-icon-top tabs-color-active-positive">

        <ion-tab title="Articles" icon-off="ion-ios-paper-outline" icon-on="ion-ios-paper" ui-sref="tab.article">
            <ion-nav-view name="tab-article">
            </ion-nav-view>
        </ion-tab>

        <ion-tab title="Closet" icon-off="ion-ios-briefcase-outline" icon-on="ion-ios-briefcase" ui-sref="tab.closet">
            <ion-nav-view name="tab-closet"></ion-nav-view>
        </ion-tab>

        <ion-tab title="Settings" icon-off="ion-ios-gear-outline" icon-on="ion-ios-gear" ui-sref="tab.settings">
            <ion-nav-view name="tab-settings"></ion-nav-view>
        </ion-tab>

    </ion-tabs>

</script>

<script id='templates/tab-article.html' type='text/ng-template'>
    <ion-view title="Articles Page">
        <ion-content>
            Articles page
        </ion-content>
    </ion-view>
</script>

<script id='templates/tab-closet.html' type='text/ng-template'>
    <ion-view title="Closet Page">
        <ion-content>
            Closet page
        </ion-content>
    </ion-view>
</script>

<script id='templates/tab-settings.html' type='text/ng-template'>
    <ion-view title="Settings Page">
        <ion-content>
            Settings page
        </ion-content>
    </ion-view>
</script>

  <ion-tab title="LogIn" hidden="true">
      <ion-nav-view name="tab-logIn"></ion-nav-view>
  </ion-tab>