---
title: "坑"
date: "2026-04"
category: "Angular"
tags: ["Angular"]
description: "這裡有個坑，這倆是不能並用的，響應式表單內如果要單獨加ngModel，就必須給他加上單獨模式。因為響應式表單本身就自帶雙向繫結，都加的話就會衝突..."
source: "https://enriquemark.com/zh-hant/posts/%E5%9D%91"
---

```ts
//模板表單
[(ngModel)]="cityValue" [ngModelOptions]="{standalone: true}"
//響應式表單
[formGroup]="form"
formControlName="enName"
```

這裡有個坑，這倆是不能並用的，響應式表單內如果要單獨加`ngModel`，就必須給他加上單獨模式。因為響應式表單本身就自帶雙向繫結，都加的話就會衝突。

取資料的時候一定要確定資料到底有沒有上去，這個很關鍵，有些地方需要顯示更新，所以參考前人的寫法很重要。

所以最好是保持一致性，實際上`form`完全是可以巢狀的，如果需要再討一個group，那就直接套。

```ts
// 1. formGroup - 绑定整个表单，根節點聲明
<form [formGroup]="myForm">
// 2. formControlName - 绑定单个控件，下同，對應form内部的key
<input formControlName="name">
// 3. formGroupName - 绑定嵌套表单组，formGroup内部再套一個Group的時候就用這個
<div formGroupName="address">
// 4. formArrayName - 绑定表单数组
<div formArrayName="skills">
  @for (skill of skills.controls; track $index) {
    <input [formControlName]="$index">
  }
</div>
```

另一個方面，`[formControl]`是一個和`[formGroup]`一樣可以單獨存在的物件，但`[formArray]`則是 不存在的，因為formArr很少會但

`{ emitEvent: false }`是為了防止出發無限迴圈，比如在一個副作用的時候，在裡面更新一個可能導致副作用的表，就得把這個加進去，否則會無限迴圈，這個的意思就是阻止其向外傳送更新訊號。