Angularjs ionic/angular$state.go为登录页面提供空白屏幕

我正在尝试使用firebase为我的ionic应用程序实现登录/身份验证页面，但遇到了一些问题

我在应用程序的主要部分使用选项卡，但当我尝试将用户重定向到登录页面（隐藏我的选项卡视图）时，登录页面显示为空白，尽管状态和url指示正确。这里是我声明状态和选项卡的地方：

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

  // setup an abstract state for the auth section
  .state('auth', {
    url: '/auth',
    abstract: true,
  })

  .state('auth.login', {
    url: '/login',
    views: {
      'main-view1': {
        templateUrl: 'templates/auth/login.html',
        controller: 'LogInCtrl'
      }
    },
    data: {
      authenticate: false
    }
  })

  .state('auth.signup', {
    url: '/signup',
    views: {
      'main-view2': {
        templateUrl: 'templates/auth/signup.html',
        controller: 'SignUpCtrl'
      }
    },
    data: {
      authenticate: false
    }
  })

  // 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.home', {
    url: '/home',
    views: {
      'tab-home': {
        templateUrl: 'templates/tab-home.html',
        controller: 'homeCtrl'
      }
    },
    data: {
      authenticate: true
    }
    });
});

我的重定向在run函数中发生：

.run(function($ionicPlatform, $rootScope, $state, AuthService) {
  $ionicPlatform.ready(function(){
    AuthService.userIsLoggedIn().then(function(response)
    {
      if(response === true)
      {
        $state.go('tab.home');
      }
      else
      {
        $state.go('auth.login');
      }
    });

    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if (window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
  });

  // UI Router Authentication Check
  $rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams){
    if (toState.data.authenticate)
    {
      AuthService.userIsLoggedIn().then(function(response)
      {
        if(response === false)
        {
          event.preventDefault();
          $state.go('auth.login');
        }
      });
    }
  });
})

最后，我的模板/auth/login.html文件如下所示：

<ion-view>
  <ion-header-bar class="bar-stable">
    <h1 class="title">Log In</h1>
  </ion-header-bar>
  <ion-content class="padding">
    <button class="button button-block button-positive" ng-click="facebookLogin()">Login with Facebook</button>
    <div class="row">
      <div class="col col-center">
        <h4 class="text-center">OR</h4>
      </div>
    </div>
    <form name="login_form" class="form-container" novalidate>
      <div class="list list-inset">
        <label class="item item-input">
          <input type="email" placeholder="Email" ng-model="user.email" required>
        </label>
        <label class="item item-input">
          <input type="password" placeholder="Password" ng-model="user.password" required>
        </label>
      </div>
      <button class="button button-block button-balanced" ng-click="login(user)" ng-disabled="login_form.$invalid">Login</button>
    </form>
    <button class="button button-block button-clear button-positive button-small" ui-sref="auth.signup">
      Sign Up
    </button>
    <div ng-show="errors">
      <p class="message error" ng-repeat="error in errors"><b>[{{error.code}}]</b> {{error.msg}}</p>
    </div>
  </ion-content>
</ion-view>

登录
使用Facebook登录
或
登录
注册
[{{error.code}}]{{{error.msg}

---

在实现登录页面时，有什么想法会出错吗？

对于登录/注册部分，我不会采用herarchy方法。您应该创建没有身份验证的简单状态。（这似乎不是强制性的）。如果决定删除它，则需要删除ui视图引用“main-view1”和“main-view2”，因为这些引用指示将加载视图的位置，并且需要在父级模板中声明

如果仍然希望保留author父视图，则需要为抽象状态创建一个模板，并使用ui-view属性声明一个div，给它一个类似“main-view”的名称，然后将auth.login和auth.signup ui-view引用都更改为“main-view”