Question

无法设置 userNm 的属性未定义

2020-03-29

595

javascript angular typescript ionic-framework google-cloud-firestore

从 DB 获取值后，我尝试将其放入变量中，但这样做时出现错误：

core.js:6014 错误错误：未捕获（在承诺中）：TypeError：无法设置未定义的属性“userNm” TypeError：无法设置未定义的属性“userNm”

这是我的 ts 代码：

userNm: string ='';

ngOnInit(){

   console.log("trying...");
   firebase.firestore().collection(`Students`)
   .where("authId", "==", this.userId) 
   .get()
   .then(querySnapshot => {
     querySnapshot.forEach(function(doc) {
         console.log(doc.data().Name); // OK RESULT IN CONSOLE.LOG,NAME IS String in db.
         this.userNm=doc.data().Name;  // ERROR HERE
         console.log(this.userNm)
         console.log(doc.id, " ===> ", doc.data());
     });
   });

控制台和数据库的屏幕截图：

Answer 1

this Javascript function() 中的关键字指的是函数的作用域。要使用成员变量，请使用箭头函数构造。您可以尝试以下方法

firebase.firestore().collection(`Students`)
  .where("authId", "==", this.userId) 
  .get()
  .then(querySnapshot => {
    querySnapshot.forEach((doc) => {   // <-- Use arrow function here
      console.log(doc.data().Name);
      this.userNm = doc.data().Name;
      console.log(this.userNm)
      console.log(doc.id, " ===> ", doc.data());
    });
  });

Answer 2

querySnapshot.forEach(function(doc) 这代表 匿名 函数 this 。使用 lambda ..

querySnapshot.forEach((doc) =>{

querySnapshot.forEach((doc) =>{
         console.log(doc.data().Name); // OK RESULT IN CONSOLE.LOG,NAME IS String in db.
         this.userNm=doc.data().Name;  // ERROR HERE
         console.log(this.userNm)
         console.log(doc.id, " ===> ", doc.data());
     });