登录 Ionic 3 + Angular 4 + Firebase 移动应用程序时出错 - 错误：使用电子邮件和密码登录失败："email"必须是有效的字符串

Question

我正在尝试使用Firebase创建一个简单的聊天应用程序。在火力基地中注册用户工作。尝试使用其中一个注册用户名(电子邮件地址)登录时，我收到以下错误消息：

运行时错误：未定义用户名

用户在登录时提供他们的用户名.html我想稍后在聊天.html页面上使用此用户名。这是登录后的下一页。

登录.html：

<ion-header>
<ion-navbar>
<ion-title>
Login
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-list>
<ion-item>
<ion-label floating>Username</ion-label>
<ion-input type="text" [(ngModel)]= "username"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Password</ion-label>
<ion-input type="text" [(ngModel)]= "password"></ion-input>
</ion-item>
</ion-list>
<div padding>
<button ion-button (click)="signInUser()">Sign in</button>
</div>
</ion-content>

登录.ts：

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, AlertController, NavParams } from 'ionic-angular';
import { AngularFireAuth } from 'angularfire2/auth';
import { ChatPage } from '../chat/chat';
@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
username: string= '';
password: string= '';
constructor(private fire: AngularFireAuth, public navCtrl: NavController, private alertCtrl: AlertController, public navParams: NavParams) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad LoginPage');
}
alert(message: string) {
this.alertCtrl.create({
title: 'Info!',
subTitle: message,
buttons: ['OK']
}).present();
}
signInUser() {  
username= this.username;
message= this.message;

this.fire.auth.signInWithEmailAndPassword(this.username, this.password).then(data=> {
console.log('got data', this.fire.auth.currentUser);
this.alert('Success! You're logged in');
this.navCtrl.push(ChatPage);
}).catch(error => {
console.log('got an error', error);
this.alert(error.message);
})
console.log('Would sign in with ', this.username, this.password)
}
}

Answer 1

从signInWithEmailAndPassword()函数中删除this.username和this.password变量的".value"并检查