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

Question

所以我正在尝试为一个应用程序制作一个注册表单，除了它引发错误之外，一切似乎都运行良好。 数据似乎出现在我的数据库中，但是当我尝试“ng serve”时，编译器会出错。

我的浏览器控制台吐出以下语句：

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

这和标题说的一样。

"ERROR in src/app/core/auth.service.ts(57,11): error TS2740: Type '{ uid: any; email: any;
displayName: any; photoURL: any; }' is missing the following properties from type 'User': delete, emailVerified, getIdTokenResult, getIdToken, and 24 more."

我尝试查找语法错误，因为我正在学习教程。尝试检查是否没有大写小写等。

以下是我的 auth.service.ts 文件

import { Injectable } from "@angular/core";
import { Router } from "@angular/router";
import { AngularFireAuth } from "angularfire2/auth";
import {
  AngularFirestore,
  AngularFirestoreDocument
} from "angularfire2/firestore";
import { Observable } from "rxjs/Observable";
import "rxjs/add/operator/switchMap";
import { User } from "firebase";
import { of } from "rxjs";

 interface user {
   uid: string;
   email: string;
   photoURL ? : string;
   displayName ? : string;
 }

 @Injectable()
 export class AuthService {
   user: Observable < user >

     constructor(
       private afAuth: AngularFireAuth,
       private afs: AngularFirestore,
       private router: Router
     ) {
       this.user = this.afAuth.authState.switchMap(user => {
         if (user) {
           return this.afs.doc < User > ('users/${user.uid}').valueChanges();
         } else {
           return of(null)
         }
       })
     }

   emailSignIn(email: string, password: string) {
     return this.afAuth.auth.signInWithEmailAndPassword(email, password)
       .then(() => console.log("You have successfully signed in"))
       .catch(error => console.log(error.message))
   }

   emailSignUp(email: string, password: string) {
     return this.afAuth.auth.createUserWithEmailAndPassword(email, password)
       .then(user => this.updateUserData(user))
       .then(() => console.log("Welcome, your account has been created!"))
       .catch(error => console.log(error.message))
   }

   signOut() {
     return this.afAuth.auth.signOut()
       .then(() => {
         this.router.navigate(['/'])
       })
   }

   private updateUserData(user) {
     const userRef: AngularFirestoreDocument < User > =
       this.afs.doc(`users/${user.uid}`)
     const data: User = {
       uid: user.uid,
       email: user.email || null,
       displayName: user.displayName,
       photoURL: user.photoURL
     }
     return userRef.set(data, {
       merge: true
     })
   }
 }

我只需要摆脱错误，所以它不会让我在未来失望。万一以后数据库出了什么问题，也让我学习如何解决这类问题。

在输入新的用户电子邮件和有效密码后，firebase 会注册更改并将其存储在其数据库中，但由于某种原因，我收到了这个令人讨厌的错误，我不喜欢看到带红色下划线的代码。

几乎只是为我正在创建的应用程序的注册页面制作功能。

感谢您的任何帮助。

Answer 1

您的 const data 不是 firebase 提供的 User 接口类型。可以查看源码中的firebaseUser接口，里面包含错误提示等属性，或者阅读官方documentation。

您想使用您创建的界面，即user:

const data: user = {
  uid: user.uid,
  email: user.email || null,
  displayName: user.displayName,
  photoURL: user.photoURL
}

这意味着您想要的文档也是user 类型：

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

您还需要从注册中返回 user.user:

return this.afAuth.auth.createUserWithEmailAndPassword(email, password)
  .then(user => this.updateUserData(user.user))

因为createUserWithEmailAndPassword 返回promise of UserCredential

我看到你在其他地方使用User作为类型，所以如果你遇到其他地方有类似问题，也是同样的原因。

作为补充，我可以提一下，firebase.User 是什么用户？嗯，这就是你返回的用户：

this.afAuth.auth.currentUser