0

관찰 가능 항목에 매핑 된 데이터를 렌더링하는 데 문제가 있습니다.AngularFirebase/ionic2로 관측 할 수있는지도 속성

이 내 코드가 보이는 방법은 다음과 같습니다. 페이지를 렌더링 할 때

// ChatService.ts 
 
getChats() { 
 
    return this.authService.getUid().then(uid => { 
 
     let chats = this.af.database.list(`/users/${uid}/chats`); 
 
     return chats; 
 
    }); 
 
} 
 

 
// Chatcomponent.ts 
 
chats: FirebaseListObservable<any[]>; 
 

 
this.chatService.getChats() 
 
    .then(chats => { 
 
     this.chats = chats.map(users => { 
 
      return users.map(user => { 
 
       user.info = this.af.database.object(`/users/${user.$key}`) 
 
       return user; 
 
      }); 
 
     }); 
 
    }) 
 
//The HTML File 
 
// chat.html 
 
<ion-item-sliding *ngFor="let chat of chats | async" (click)="openChat(chat.$key)"> 
 
    <p>{{chat.$key}}</p> 
 
    <span>{{(chat.info| async).displayName}}</span> 
 
</ion-item-sliding>

지금, 제대로 채팅 $ 키를 표시하지만 chat.info.displayName 렌더링하지 않습니다.

내가 뭘 잘못하고 있니?

+0

' {{(chat.info {? 나 displayName} {(? 비동기 채팅 .INFO)}에에 | async) .displayName}}'왜 비동기를 다시 사용합니까? 그것의 루프 안에 필요하지 않다 –

+0

고마워, 나는 그것을 몰랐다. 그러나 {{chat.info.displayName}}으로 변경하면 아무런 차이가 없습니다. 데이터는 여전히 렌더링되지 않습니다. – Stefan

+0

'getChats()'print의'console.log (chats)'는 무엇을 인쇄합니까? 어쩌면 당신은 서버 측에서 displayname을 얻지 못할 것입니다. –

답변

0

문제는 html 템플릿에 있습니다. 내가 변경 한 후

그것은 일 {{(chat.info | 비동기) .displayName}} |