如何更新或编辑个人资料信息

Question

我正在制作一个应用程序，它是项目汽车的AirBnB。我目前正忙于客户端配置文件，我想添加一个功能，用户可以编辑/更新他们的个人资料。老实说，我不知道怎么做。

我正在使用Ionic 2和打字稿。

这是我的Firebase：

以下是我的代码：

auth.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import firebase from 'firebase';


/*
  Generated class for the AuthProvider provider.

  See https://angular.io/docs/ts/latest/guide/dependency-injection.html
  for more info on providers and Angular DI.
*/
@Injectable()
export class AuthProvider {

  public fireAuth:firebase.auth.Auth;
  public userProfileRef:firebase.database.Reference;
  public vehicleRef:firebase.database.Reference;
  //public userId= firebase.auth().currentUser.uid;

  constructor(public http: Http) {
    this.fireAuth = firebase.auth();
    this.userProfileRef = firebase.database().ref('/userProfile');
    //this.userId= firebase.auth().currentUser.uid;
    //this.vehicleRef = firebase.database().ref('/userProfile/' + userId + '/vehicles/');//linked to firebase node userProfile
    console.log('Hello AuthProvider Provider');
  }



  loginUser(email: '', password: ''): firebase.Promise<any>{
    return this.fireAuth.signInWithEmailAndPassword(email, password);
  }

  viewUser(userId: any){
            var userRef = this.userProfileRef.child(userId);
            return userRef.once('value'); 
}
  /*
  viewCar(carId: any){
    var userId= firebase.auth().currentUser.uid;
        var userRef = this.vehicleRef.child('/userProfile/' + userId + '/vehicles/' + carId);
        return userRef.once('value'); 
}*/

  signupUser(name: string, surname: string, birthday: any, licenseNum: string, email: string, password: string ): firebase.Promise<any> {
    return this.fireAuth.createUserWithEmailAndPassword(email, password).then( newUser => {
      this.userProfileRef.child(newUser.uid).update({
        name: name,
        surname: surname,
        birthday: birthday,
        licenseNum: licenseNum,
        email: email,
        password: password
      });
    });
  }

  resetPassword(email: string): firebase.Promise<void> {
    return this.fireAuth.sendPasswordResetEmail(email);
  }

  logoutUser(): firebase.Promise<void>{
    this.userProfileRef.child(this.fireAuth.currentUser.uid).off();
    return this.fireAuth.signOut();
  }
}

clientprofile.html

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>

    <ion-title>
      Client Profile
    </ion-title>

  </ion-navbar>
</ion-header>
<ion-content padding id="page6">
  <ion-list id="clientProfile-list2">

    <ion-item color="none" id="clientProfile-list-item4">
      <ion-thumbnail item-left>
        <img src="assets/img/baHyhhtoTuztiAKn4F4x_download.jpeg" />
      </ion-thumbnail>
    </ion-item>

    <ion-item id="clientProfile-input2">
      <ion-label>
        Name
      </ion-label>
      <ion-note item-end>{{ userDisplayName }}</ion-note>
    </ion-item>

    <ion-item id="clientProfile-input3">
      <ion-label>
        Surname
      </ion-label>
      <ion-note item-end>{{ userDisplaysName }}</ion-note>
    </ion-item>

    <ion-item id="clientProfile-input5">
      <ion-label>
        Birthday
      </ion-label>
      <ion-note item-end>{{ userDisplayBirth }}</ion-note>
    </ion-item>

    <ion-item id="clientProfile-input6">
      <ion-label>
        Email
      </ion-label>
      <ion-note item-end>{{ userDisplayEmail }}</ion-note>
    </ion-item>


    <!--<ion-item id="clientProfile-input7">-->
    <!--  <ion-label>-->
    <!--    Password-->
    <!--  </ion-label>-->
    <!--  <ion-input type="text" placeholder=""></ion-input>-->
    <!--</ion-item>-->
  </ion-list>
  <!--<button id="feedback-button10" ion-button color="positive" block on-click="goToFeedback()"> <!--block href-inappbrowser="/signup"-->-->
  <!--   Edit Profile-->
  <!--  </button>-->
  <button id="feedback-button10" ion-button color="positive" block on-click="goToFeedback()"> <!--block href-inappbrowser="/signup"-->
     Feedback
    </button>
</ion-content>

和clientprofile.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { AuthProvider } from '../../providers/auth/auth';
import firebase from 'firebase';
import { FeedbackPage } from '../feedback/feedback';
@Component({
  selector: 'page-client-profile',
  templateUrl: 'client-profile.html',

})
export class ClientProfilePage {
  private userPhotoUrl:any;
  private userDisplayEmail : any;
  private userDisplaysName : any;
  private userDisplayName : any;
  private userDisplayBirth : any;
  private userDisplayLicense : any;

  constructor(public navCtrl: NavController, private AuthProvider: AuthProvider) { 

    var myUserid= firebase.auth().currentUser.uid; //current user id
    this.displayUser(myUserid);

  }

  displayUser(theUserId){

    var that = this;

    this.AuthProvider.viewUser(theUserId).then(snapshot => {



       that.userDisplayEmail= snapshot.val().email;
       that.userDisplayName= snapshot.val().name;
       that.userDisplaysName= snapshot.val().surname;
       that.userDisplayBirth= snapshot.val().birthday;
       that.userDisplayLicense= snapshot.val().licenseNum
    })
}

  goToFeedback(params){
    if (!params) params = {};
    this.navCtrl.push(FeedbackPage);
  }
}

我认为我的代码需要进入auth.ts.并且html应该允许在每个字段的一侧使用小编辑选项

以下是我在auth.ts中的尝试：

var user = firebase.auth().currentUser;

user.updateProfile({ displayName: "Jane Q. User"}).then(function() {