У меня есть следующий компонент Angular 7:
export class PostComponent implements OnInit {
post$: Observable<PostModel>;
constructor(private postService: PostService) { }
ngOnInit() {
this.post$ = postService.getPostById(25);
}
}
В шаблоне компонента я использовал следующее:
<p>Title: {{post$.title}}</p>
Заголовок пуст, и я думаю, это потому, что post $ является Observable.
При использовании массивов, например posts$: Observable<PostModel[]> Я передаю наблюдаемое в шаблон, и оно отлично работает, используя ngFor.
Но как мне это сделать в этом случае?
Наблюдаемый с массивом
При использовании Observable для массива в шаблоне HTML есть следующее:
<div *ngIf="(posts$ | async)?.length > 0; else loading">
<ng-container *ngFor="let post of posts$ | async">
{{post.title}}
</ng-container>
</div>
<ng-template #loading>
Loading ...
</ng-template>
Это позволяет мне показывать сообщение о загрузке во время загрузки.