私のionicアプリケーションにfirebaseを使用してログイン/認証ページを実装しようとしていますが、問題が発生しています。
私は自分のアプリのメイン部分でタブを使用しますが、ログインページ(タブ表示を隠す)にユーザーをリダイレクトしようとすると、状態と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(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');
}
});
}
});
})
最後に、私のテンプレート/認証/ 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>
ログインページを実装する際に間違っているアイデアはありますか?