使用AngularJS $ stateProvider隐藏URL中的当前状态名称

Question

我正在使用AngularJS $ stateProvider.要在我的应用程序中导航,用户可以使用此功能从一个州进入州:

$rootScope.gotoState = function(stateName) {
  $state.go(stateName, {}, { location: false } ); 
};

这允许更改状态并加载新视图而不更改URL(位置:false).

但是,当进入应用程序时(在"index.html"页面中发生),显示的URL是"myWebsite/index.html#/ tab/index",索引是应用程序的第一个状态.我的问题是:如何将其更改为仅显示"myWebsite/index.html"？

注意:目前,由于位置设置为false,用户无法使用浏览器的来回按钮进行导航,因此如果存在解决此问题的解决方案,我很感兴趣.

这是州宣言:

angular.module('ionicApp', ['ionic', 'ngCookies'])
.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {

    $ionicConfigProvider.tabs.position('top'); // values: bottom, top

    $stateProvider
      .state('tabs', {
        url: "/tab",
        abstract: true,
        templateUrl: "templates/tabs.html"
      })
      .state('tabs.index', {
        url: "/index",
        cache:false,
        views: {
          'index-tab': {
            templateUrl: "home.html"
          }
        }
      })
      .state('tabs.profile', {
        url: "/profile",
        cache:false,
        views: {
          'profile-tab': {
            templateUrl: "profile.html"
          }
        }
      })

      $urlRouterProvider.otherwise("/tab/index");
  })

  .run(function($rootScope, $state, $location) {
    $rootScope.$state = $state;
    $rootScope.$location = $location;
    $rootScope.gotoState = function(stateName) {
      $state.go(stateName, {}, { location: false } ); 
    };
  })

我对单页应用程序不是很熟悉,我不知道这个结构是否可能.如果不是,我会很高兴知道什么是最好的选择.