---
title: "Going back from two-way binding to one-way"
date: "2026-04"
category: "Angular"
tags: ["Angular"]
description: "The template form of two-way binding is really a one-shot piece of syntax sugar in Angular. At bottom it packages binding the data once and having a change fire an event callback and update, all into one thing, which is the default banana-in-a-box form..."
source: "https://enriquemark.com/en/posts/%E9%9B%99%E5%90%91%E7%B6%81%E5%AE%9A%E5%9B%9E%E6%AD%B8%E5%96%AE%E5%90%91"
---

The template form of two-way binding is really a one-shot piece of syntax sugar in Angular. At bottom it packages binding the data once and having a change in the data fire an event callback and update, all into one thing, which is the default banana-in-a-box form.

And of course you can take control of this yourself. Which is to say, when I need to, I can go back by hand to that "tedious" one-way data flow mechanism and point the event callback at my own method, so the whole process runs at a granularity I control.

The default form has a very clear precondition, which is that both sides are objects you can modify directly, otherwise updating straight back the other way errors out. Or say what I want is to do some custom preprocessing on the data coming back, and in that case I have to take control myself.

```HTML
  <input 
    type="text" 
    [ngModel]="promoCode" 
    (ngModelChange)="onPromoCodeChange($event)" 
    [ngModelOptions]="{ standalone: true }"
    placeholder="Type any letter"
  >
```

`\[ngModel]` appearing on its own here means binding, or the way I personally read it, subscribing.

`(ngModelChange)` when the bound object changes, this callback fires, and its $event hands back the changed value, whose type is the same as the type given at binding time.

`\[ngModelOptions]="{ standalone: true }"` this is the key to template syntax and reactive forms still working when they're mixed. Normally any child node of a reactive form has to name its own formControlName, and it errors outright if there isn't one. Under the current template form there's no way to hang a legal reactive control on it, so an extra declaration is naturally needed, which makes this one necessary too.

---

**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/雙向綁定回歸單向>).