Angular FormArrayで動的に変化するフォーム

こんにちは。レモンティーです。以前、フォームについての記事を書きました。 www.sawalemontea.com今回はFormArrayを使って動的に変化するフォームをつくります。 AngularMaterialでMatErrorのバリデーションも付けます。AngularAngular Material 使い方はFormBuilderでFormGroupにFormArrayを入れておいて 項目を増減したい時にそのFormArrayに子FormGroupを pushしたりremoveAtする感じです。 以下、複数のリンクを入力するフォームを例に見ていきます。 FormBuilderでFormA…

Firebase CloudFirestoreで条件にあっているのにERROR Error: Missing or insufficient permissions.が起こるとき

こんにちは。レモンティーです。今回はFirebaseのCloudFirestoreのルールについてです。 普通に公式ドキュメントに書いてあるのに見落としていたことなので多くの人には問題ないかもしれません。ちょうどここに書いてあります。 https://firebase.google.com/docs/firestore/security/rules-query?authuser=0 例えば allow read :if request.auth.uid == resource.data.author;のようなルールできちんとルールを満たしているのに ERROR Error: Missing o…

Angular AngularMaterialのDialogを使う

こんにちは。レモンティーです。今回はAngularMaterialのDialogを使います。公式はコチラ Angular Material AngularMaterialのDialogでは、まずDialogのコンポーネントをつくり それを呼び出し時に指定して使います。さっそく見ていきます。 準備 Dialogのコンポーネント作成 呼び出し 準備 ・AngularMaterialのインストール ・MatDialogModuleのインポート をします。 Dialogのコンポーネント作成 型の恩恵を受けたい場合は表示するデータのinterfaceを定義します dialogData.ts export…