Question

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

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

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

然而，如果我手动输入输入字段，那么ngModel似乎确实会更新，因为管道会根据新值触发过滤。我已经限制了一个改变＆＃39;输入的处理程序，在键入时或使用datepicker时触发。

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

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

Answer 1

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

请参阅此plunker

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

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

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

}, 5000);

Answer 2

使用datepicker自己的事件，我只能手动更新模型值。

  @Input()
  @HostBinding('component-type')
  componentType:String="type-default"

感谢Madhu Ranjan的建议。

Answer 3

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

Angular 2 - ngModel未从datepicker

3 个答案: