Angular 2 - ngModel 未从日期选择器更新

Question

我有一个绑定到模型中的值的输入。

     <input type="text" class="form-control" [(ngModel)]="currentDate">

我有一个用于填充此输入的日期选择器。当通过日期选择器选择一个值时，输入似乎不会更新模型，因为它不会触发代码中更下方的管道。

但是，如果我手动输入输入字段，那么 ngModel 似乎会随着管道的更新而更新，然后根据新值触发过滤。我已将 'on change' 处理程序绑定到输入，该处理程序在键入或使用日期选择器时触发。

    $('#datepicker').datepicker().on('changeDate', function(e){
        //Fires on change
    })

有没有办法手动触发 ngModel 更改事件，或者是否有其他人知道的更优雅的解决方案？

Answer 1

使用日期选择器自己的事件，我能够手动更新模型值。

AttachDateChangeHandler(): void {
    $('#datepicker').datepicker().on('changeDate', (e)=> {
        this.currentDate = e.date.***()
    })
}

感谢 Madhu Ranjan 的建议。

Answer 2

你可以这样做，触发 Angular2 的变化检测..

看到这个plunker

setTimeout(() => {
    $('#myinput').val("changed..");

    var evt = new Event("input", {"bubbles":true, "cancelable":false});

    $('#myinput')[0].dispatchEvent(evt);

}, 5000);

Answer 3

使用Primeng的日历很有用https://www.primefaces.org/primeng/#/calendar

Angular 2 - ngModel 未从日期选择器更新

Angular 2 - ngModel not updated from datepicker

angular2-ngmodel

angular