Angularの AsyncPipe は非同期データをテンプレートバインディングするのに便利な機能だが、実は実装当初からずっと大きな問題を抱えている。それが「初期値null問題」だ。 本稿ではAsyncPipeの初期値null問題とその根本的原因を解説し、この問題を解決するための新しい非同期データバインディングのあり方を論じる。 AsyncPipeの仕組みを理解する一般的なAngularアプリケーションを作る上でいまやAsyncPipeは必ず使われるものと言っても過言ではない。Observable型のデータを購読し、そのスナップショットをデータバインディングするために多用される。 基本的な使われ方は次のような形だ。 @Component({ selector: "app-root", template: ` <div *ngIf="source$ | async as state"> {{