angularで[]の有無による違いについて

Question

https://qiita.com/hedrall/items/b5dc7ec2cd1c635aeaa2
ここでのformControlNameは[formControlName]で

https://stackoverflow.com/questions/54786812/angular-reactive-forms-select-default-object
ここでのformControlNameはformControlNameになっています。

[]の有無で何が変わるのでしょうか？

Answer 1

簡単に説明を書いておきます

[formControlName]="'prefecture'"
と
formControlName="prefecture"

はやってることは同じです。

formControlNameは属性でclassやidなどと同じであとに続くダブルクォーテーションの中には文字列が入ります。

一方、[formControlName]はangularのプロパティバインディングというもので、あとに続くダブルクォーテーションの中にはjavascriptを記述することが出来ます。

[formControlName]="'prefecture'"を見てみるとダブルクォーテーションの中に文字列を表すシングルクォーテーションがあります。

これをシングルクォーテーションなしで[formControlName]="prefecture"と書くと、ダブルクォーテーションの中はjavascriptなのでprefectureという変数をコンポーネントから探します。

<form [formGroup]="formGroup">これもプロパティバインディングでダブルクォーテーションの中はjavascriptです。
なのでformGroupという文字列をバインディングしているのではなく、コンポーネント内のformGropuという変数の中に入ったFormGroupオブジェクトをバインディングしていることになります。

Comments

[退会済みユーザー]

よくわかりました。ありがとうございました。

Answer 2

リンク内容