I am seeing inconsistent behavior where the UI does not update correctly for certain values written to a field bound to [ngModel].
My template:
<input
type="number"
[ngModel]="displayValue"
(ngModelChange)="updateValue($event)"
/>
TS file:
export class HelloComponent {
displayValue = 0;
public updateValue(displayValue: number) {
const validatedValue = this.constrainValue(displayValue);
this.displayValue = validatedValue;
}
private constrainValue(value: number) {
return (value > 100) ? 100 : value;
}
}
100 (ie: 230), constrainValue adjusts it to 100 and they UI updates as expected.23456), constrainValue adjusts it to 100 but the UI only updates the first 3 numbers so I get 10056.Stackblitz: https://stackblitz.com/edit/angular-ivy-eleb1u?file=src%2Fapp%2Fhello.component.ts