使用无效数据调用的函数 DocumentReference.set()。不支持的字段值：未定义（在字段 firstName 中找到）

Question

你好，我坐在这里的一个项目我找不到错误或我做错了什么。

我正在使用 Angular 6 和 firebase/firestore

我的问题是，当我想用​​电子邮件和密码创建用户时，它可以正常工作，但我随后添加了更多字段，如名字、姓氏等。

Auth.service.ts

我的身份验证服务具有如下所示的接口和功能。我只用电子邮件和密码测试了创建用户，效果很好。

在我的 firebase 中，我使用电子邮件/密码激活了身份验证，并创建了一个包含文档 users 的集合 users 并添加了所有字段 firstName， 姓氏等等。

interface User {
uid: string;
email?: string;
photoURL?: string;
displayName?: string;
firstName?: string;
lastName?: string;
address?: string;
zipCode?: string;
city?: string;
phoneNumber?: string;

}


emailSignUp(email: string, password: string) {
return this.afAuth.auth
  .createUserWithEmailAndPassword(email, password)
  .then(credential => {
    this.notify.update('Welcome new user!', 'success');
    return this.updateUserData(credential.user); // if using firestore
  })
  .catch(error => this.handleError(error));

}

  private updateUserData(user) {
// Sets user data to firestore on login

const userRef: AngularFirestoreDocument<any> = 
this.afs.doc(`users/${user.uid}`);

const data: User = {
  uid: user.uid,
  email: user.email,
  displayName: user.displayName,
  photoURL: user.photoURL,
  firstName: user.firstName,
  lastName: user.lastName,
  address: user.address,
  zipCode: user.zipCode,
  city: user.city,
  phoneNumber: user.phoneNumber
}

return userRef.set(data, { merge: true })

}

 User-form.component.html

这是我的组件，用于创建新用户。

 <form [formGroup]="userForm" *ngIf="newUser" (ngSubmit)="signup()">
    <h1>Log ind / Opret ny profil</h1>
    <br>

<h3>Har du allerede en bruger så tryk på log ind</h3>
<p class="btn btn-primary" (click)="toggleForm()">Log ind</p>

<h3>Opret ny profil</h3>
<!--<p class="button is-small" (click)="toggleForm()">Already Registered? 
</p>-->
<hr>

<label for="firstName">Fornavn</label>
<input type="text" class="input" formControlName="firstName" 
name="firstName" required >

<label for="lastName">Efternavn</label>
<input type="text" class="input" formControlName="lastName" name="lastName" 
required>

<label for="telefonnummer">Telefonnummer</label>
<input type="tel" class="input" formControlName="phoneNumber" 
name="telefonnummer" required>

<label for="adresse">Adresse</label>
<input type="text" class="input" formControlName="address" name="adresse" 
required>

<label for="postnummer">Postnummer</label>
<input type="number" class="input" formControlName="zipCode" 
name="postnummer" required>

<label for="by">By</label>
<input type="text" class="input" formControlName="city" name="by" required>

<label for="email">Email</label>
<input type="email" class="input" formControlName="email" name="email" 
required autocomplete="new-password">

<div *ngIf="formErrors.email" class="notification is-danger">
    {{ formErrors.email }}
</div>

<label for="password">Password</label>
<input type="password" class="input" formControlName="password" 
name="password" required>

<div *ngIf="formErrors.password" class="notification is-danger">
    {{ formErrors.password }}
</div>

<!--
<label>
    <input type="checkbox" class="checkbox" required>Service & Betingelser
</label>
-->

<div *ngIf="userForm.valid" class="notification is-success">Form is 
valid</div>
<button type="submit" class="btn btn-primary" 
[disabled]="!userForm.valid">Opret Profil</button>

</form>

Answer 1

现在，由于 firestore 在其第 5 版中更新了其 API。因此，将 user 替换为 cred。