Javascript 角度-从Firestore获取单个文档时出现问题

我正在尝试创建一个用户列表，这是Firestore中的一个集合，然后用户将能够单击某个用户并重定向到包含更多数据的用户配置文件页面。我能够显示数据；但是，对于集合中的每个其他文档，我都会收到一个控制台错误，表示找不到属性

user-profile.ts：

 ngOnInit() {
//get user id from route
this.uid = this.route.snapshot.params['uid'];

//get user document reference from firestore using auth service
this.authService.getUserDocById(this.uid).get().then(doc =>{
    this.user = doc.data();
  }
);

if(this.uid == this.authService.getFirebaseUser().uid){
  this.isOwnProfile = true;
}
else{
  this.isOwnProfile = false;
 }
}

auth.service.ts：

getUserDocById(uid: string)
  {
    var path = ('users/' + uid);
    return this.afs.doc(path).ref; 
  }

user-profile.component.html：

  <div class="imagewrapper">
  <div [ngClass]="{ 'isOwnImage' : isOwnProfile }" [ngStyle]="{ 'background-image': 'url(' + user.profileImageUrl + ')' }" class="profileImage"></div>

---

请为该用户执行控制台操作。并检查它包含的内容。如它所述，

user

未定义。这很可能是因为

ngStyle

在您的服务设置

user

之前试图访问

user.profileImageUrl

。当我将

此.user

登录到控制台时，我得到的是

[object object]

，而不是

未定义的
。在我单击的配置文件上，我可以看到配置文件图像。它似乎试图为集合中的每个用户获取
profileImageUrl
，因为div使用ngIf:*ngIf=“user”所以，正因为如此，它在服务返回该属性之前不会尝试解析该属性。do console.log（this.user）；在doc.data（）之后。您在字符串注释中写入它，因此它显示[object object]@Shantanu添加了
*ngIf=“user”
工作！非常感谢：）
TypeError: Cannot read property 'profileImageUrl' of undefined
    at Object.eval [as updateDirectives] (UserProfileComponent.html:2)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:10853)
    at checkAndUpdateView (core.js:10250)
    at callViewAction (core.js:10491)
    at execComponentViewsAction (core.js:10433)
    at checkAndUpdateView (core.js:10256)
    at callViewAction (core.js:10491)
    at execEmbeddedViewsAction (core.js:10454)
    at checkAndUpdateView (core.js:10251)
    at callViewAction (core.js:10491)