-1
こんにちは私は、有効なユーザー名とパスワードが入力されたときに、タブコントローラーの一部であるイベントページにユーザーをリダイレクトするこれは、ユーザーがアプリにロージュたときにどのように見えるかです:私のアプリにログインした後にIonicタブが表示されない
は、ここでのログインpage.htmlのための私のコードされています
<ion-content padding id="page6">
<img src="assets/img/pDQnyrguQAqrcKYvyqqa_web_hi_res_512.png" style="display:block;width:60%;height:auto;margin-left:auto;margin-right:auto;" />
<form id="login-form3">
<ion-card id="login-card24">
<ion-list>
<ion-list id="login-list2">
<ion-item id="login-input1">
<ion-label>
Email
</ion-label>
<ion-input type="email" [(ngModel)]="user.email" [ngModelOptions]="{standalone: true}"></ion-input>
</ion-item>
<ion-item id="login-input2">
<ion-label>
Password
</ion-label>
<ion-input type="password" [(ngModel)]="user.password" [ngModelOptions]="{standalone: true}" ></ion-input>
</ion-item>
</ion-list>
</ion-list>
</ion-card>
<div class="spacer" style="height:40px;" id="login-spacer1"></div>
<button id="login-button1" ion-button (click)="login(user)" color="dark" block>
Log in
</button>
<button id="login-button2" ion-button clear color="positive" block on-click="goToSignup()">
Or create an account
</button>
</form>
</ion-content>
はここlogin.tsコードです:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { SignupPage } from '../signup/signup';
import { User } from "../../app/models/user";
import{AngularFireAuth} from 'angularfire2/auth';
import { EventsPage } from '../events/events';
@Component({
selector: 'page-login',
templateUrl: 'login.html'
})
export class LoginPage {
user = {} as User;
constructor(private afAuth: AngularFireAuth,
public navCtrl: NavController) {
}
async login(user: User) {
try {
const result = this.afAuth.auth.signInWithEmailAndPassword(user.email, user.password)
this.navCtrl.setRoot(EventsPage);
}
catch (e) {
console.error(e);
}
}
goToSignup(params){
if (!params) params = {};
this.navCtrl.push(SignupPage);
}
}
とevents.htmlページ:
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>
Events
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding id="page3">
<ion-card id="events-card26">
<ion-list>
<form id="events-form6">
<ion-searchbar placeholder="" name="" id="events-search3"></ion-searchbar>
</form>
</ion-list>
</ion-card>
</ion-content>
、最終的にevents.tsコード:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-events',
templateUrl: 'events.html'
})
export class EventsPage {
constructor(public navCtrl: NavController) {
}
}
ので、私は事前に謝罪、私はその最も可能性の高い簡単な修正を知っているが、私は、イオンへの新たなんですどんな助けも素晴らしいだろう!
ありがとうございます! :)
? –