Angular2 ngModel 更改输入类型绑定="number"

Question

我有一个数字类型的输入，当我尝试使用 onChange 事件更改值时，它不起作用。

我已经对文本输入进行了同样的尝试，效果非常好。

<input
   type="number"
   [(ngModel)]="element.value" 
   (change)="onChange($event)"
   >

export class NumFieldComponent {
    @Input() index;
    @Input() element; //element.value = 0

    onChange($event){

        var confirm = confirm("Are you sure about this?")

        if(confirm){
            //True, accept the value
        } else {
            this.element.value = 0;
            //Failed, set the input back to 0
        }
    }
}

我是 Angular2 的新手，所以我在这里缺少什么？

PS。我在使用 bools

的输入中看到了类似的问题

Answer 1

未尝试但可能有效

export class NumFieldComponent {
    @Input() index;
    @Input() element; //element.value = 0

    constructor(cdRef:ChangeDetectorRef) {}

    onChange($event){

        var confirm = confirm("Are you sure about this?")

        if(confirm){
            //True, accept the value
        } else {
            this.element.value = 0;
            this.cdRef.detectChanges(); // <<<=== added
            //Failed, set the input back to 0
        }
    }
}

Answer 2

更改为单向绑定对我有用，如果用户也取消了，则不触发更改更干净（请注意，如您所见，我仍然必须手动更新 DOM）：

<input
   type="number"
   [ngModel]="element.value"   // one way binding
   (change)="onChange($event)"
   >

export class NumFieldComponent {
    @Input() index;
    @Input() element; //element.value = 0

    onChange($event){

        var confirm = confirm("Are you sure about this?")

        if(confirm){
            this.element.value = $event.target.value
        } else {
            $event.target.value = 0;
            //Failed, set the input back to 0
        }
    }
}

Angular2 ngModel 更改输入类型绑定="number"

Angular2 ngModel change binding on Input type="number"

javascript

input

typescript

ngmodel

angular