Question

我是Ionic和Angular的新手。我正在开发一个订单放置应用程序，但我在创建新的用户配置文件时遇到问题。

我正在关注此video，但数据未保存在Firebase中。另外，我已经在firebase中有一个名单命令列表。

profile.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Profiles } from "../../models/profile/profile";
import { AngularFireAuth } from 'angularfire2/auth';
import { AngularFireDatabase } from 'angularfire2/database';
import { LoginPage } from '../login/login';


@IonicPage()
@Component({
  selector: 'page-profile',
  templateUrl: 'profile.html',
})
export class ProfilePage {

  profile = {} as Profiles
  // ref:any;

  constructor(private afAuth: AngularFireAuth, private afDatabase: AngularFireDatabase, public navCtrl: NavController, public navParams: NavParams) {
    // this.ref = afDatabase.list("Profile");
  }

  createProfile(){
    const user = this.afAuth.authState.take(1).subscribe(auth => {
      this.afDatabase.object(`Profiles/${auth.uid}`).set(this.profile)
      .then(() => {
        // this.navCtrl.setRoot(LoginPage)

      });
      console.log(user);
    })
   }
}

模型/简档/ profile.ts

export interface Profiles {
    firstName: string;
    lastName: string;
    eventName: string;
    hall: string;
    booth: string;

}

profile.html

<ion-header>
  <ion-navbar color="primary">
    <ion-title> Create Profile</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-list>
    <ion-item>
      <ion-label floating [(ngModel)]="profile.firstName" ngDefaultControl>First Name</ion-label>
      <ion-input type="text"></ion-input>
    </ion-item>
    <ion-item>
      <ion-label floating [(ngModel)]="profile.lastName" ngDefaultControl>Last Name</ion-label>
      <ion-input type="text"></ion-input>
    </ion-item>
    <ion-item>
      <ion-label floating [(ngModel)]="profile.eventName" ngDefaultControl>Event Name</ion-label>
      <ion-input type="text"></ion-input>
    </ion-item>
    <ion-item>
      <ion-label floating [(ngModel)]="profile.hall" ngDefaultControl>Hall #</ion-label>
      <ion-input type="text"></ion-input>
    </ion-item>
    <ion-item>
      <ion-label floating [(ngModel)]="profile.booth" ngDefaultControl>Booth #</ion-label>
      <ion-input type="text"></ion-input>
    </ion-item>
  </ion-list>
  <button ion-button block (click)="createProfile(Profiles)">Create Profile</button>
</ion-content>

This what i m getting on console after submitting

最后还有一件事我还在我的应用程序中集成了firebase登录系统，但没有注销，不确定是否会产生问题。

Plz指导我在哪里做错了？

Answer 1

显然，您的双向数据绑定无法正常工作。这就是profile给你一个空结果的原因。

将所有[(ngModel)]指令重新定位到ion-input，而不是ion-label。

如何使用firebase创建用户配置文件

1 个答案: