---
title: "Gotchas"
date: "2026-04"
category: "Angular"
tags: ["Angular"]
description: "There's a gotcha here, these two can't be used together. If you want to add a lone ngModel inside a reactive form, you have to put it in standalone mode..."
source: "https://enriquemark.com/en/posts/%E5%9D%91"
---

```ts
//template-driven form
[(ngModel)]="cityValue" [ngModelOptions]="{standalone: true}"
//reactive form
[formGroup]="form"
formControlName="enName"
```

There's a gotcha here, these two can't be used together. If you want to add a lone `ngModel` inside a reactive form, you have to put it in standalone mode. A reactive form comes with two-way binding of its own, so adding both makes them clash.

When you read the data, always make sure the data actually went in, that part is critical, some places need an explicit update, so looking at how the people before you wrote it really matters.

So the best thing is to stay consistent. `form` can be nested, and if you need one more group, just nest it in.

```ts
// 1. formGroup - binds the whole form, declared on the root node
<form [formGroup]="myForm">
// 2. formControlName - binds a single control, same below, maps to the key inside form
<input formControlName="name">
// 3. formGroupName - binds a nested form group, use this one when you nest another Group inside a formGroup
<div formGroupName="address">
// 4. formArrayName - binds a form array
<div formArrayName="skills">
  @for (skill of skills.controls; track $index) {
    <input [formControlName]="$index">
  }
</div>
```

The other side of it, `[formControl]` is an object that can stand on its own the same way `[formGroup]` can, but `[formArray]` doesn't exist, because formArr rarely would but

`{ emitEvent: false }` is there to keep you from triggering an infinite loop. Say you're inside a side effect and you update a form in there that could itself cause a side effect, you have to add this one, or it loops forever. What it means is stopping it from sending the update signal outward.

---

**Translation note.** I wrote this in Chinese. This English version is an LLM translation, so the wording is not mine even though the thinking is. Original: [坑](</zh-hant/posts/坑>).