だいぶ昔の記事で Angular CDK の Overlay モジュールの使い方を解説しました 1 2 3 。 今回は標準機能では実装できない簡易ポップアップを表示する Directive を実装してみるメモです。 Angular CDK を使用して全画面ローディングを表示する↩ Angular CDK O…

Angular CDK Overlay の4本目の記事です。前回は Backdrop を使用する方法についてでした。 noxi515.hateblo.jp 今回は Angular CDK Overlay で表示される Component に対して引数のデータを渡し、また表示された結果を呼び出し元で受け取る方法です。ざっく…

Angular CDK Overlay の3本目の記事です。前回は画面に対する相対位置で表示する方法についてでした。 noxi515.hateblo.jp 今回は Angular CDK Overlay の backdrop についてです。 backdrop はその名の通り、オーバーレイ表示時にオーバーレイ要素の下に全…

Angular CDK Overlay の2本目の記事です。前回は画面に対する絶対位置で表示する方法についてでした。 noxi515.hateblo.jp 今回は特定の要素に対して相対位置でオーバーレイを表示する方法です。

久しぶりにブログ書いています。どうにも仕事が忙しいと書く気力が出ません。 今回は Angular CDK Overlay を使用してサクッとオーバーレイを表示してみます。オーバーレイは画面の任意の場所に Component を表示することができます。 Angular Material だと…

前回は Angular CDK Component Harness を試しに使ってみました。今回は自作のコンポーネントに対して Component Harness を実装してみます。

遂に Angular 9 がリリースされました。リリーススケジュールが4月・10月くらいが目処だったことを考えると大分難産でしたね（筆者の感想です）。 ところで Angular CDK にテスト用の機能として Component Harness が追加されました。使い方やテストへの導入…

Angular のコンポーネントに対して外のコンポーネントから表示する要素を指定したい場合、 ng-content を使用すると自身の子要素として指定された要素を展開することができます。子要素を展開したい箇所が1つだけであれば ng-content を使用すれば十分ですが…

Angular Material をインストールすると必須の依存に含まれている Angular CDK (Component Dev Kit) 。 CDK に実装されている Overlay と Portal 、そして Angular Material の Progress spinner を使用して全画面ローディングを作ってみます。