AngularでBehaviorSubjectでloadingを表示

BehaviorSubjectでは初期値を指定しなくては行けないため値があるかないかの判定が難しいです。

そのため表示用のオブジェクトにはnullを指定しておき

export Todo {
  title: string;
  description: string;
}
public todo: BehaviorSubject<Todo|null> = new BehaviorSubject(null);

nullの場合はloading表示、値が入って初めてからオブジェクトの内容を表示するようにします。

<div *ngIf="!todo.value">
  ローディング
</div>
<div *ngIf="todo | async">
  TODOリスト
</div>