Checkbox [ngModel] does not reflect model value when updated in (onModelChange)
- Dominant language
- TypeScript
- Stars
- 101k
- Forks
- 27.5k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 288
Description
**I'm submitting a ...** (check one with "x")
```
[x] bug report
[ ] feature request
[ ] support request
```
**Current behavior**
``````
Behaves exactly like:
``````
The checkbox only reflects the model value when it is first rendered, but then becomes functionally equivalent to a checkbox without a binding. Manually detecting changes or using `setTimeout` inside `(ngModelChange)` does not work around this issue. The same workarounds _do_ work when used with `(click)`, but voids the use of `[ngModel]`.
**Expected behavior**
The logic in `onChanges` should run, and the view should then be updated to reflect the model's current value.
**Minimal reproduction of the problem with instructions**
http://plnkr.co/edit/g9niPnLsUy6wWbzm0mHi?p=preview
**What is the motivation / use case for changing the behavior?**
`[ngModel]` should always reflect the model value.
**Please tell us about your environment:**
Mac OS X Sierra, IntelliJ IDEA
* **Angular version:**
2.2.0
* **Browser:**
all
* **Language:** [all | TypeScript X.X | ES6/7 | ES5]
TypeScript 2.0.2
Contributor guide
Research direction
Start with the linked Plunker reproduction and the checkbox using [ngModel] with (ngModelChange), then trace how the model update reaches the view. Confirm the fix by ensuring the checkbox reflects the current model value after onChanges runs, including changes made during the handler.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100