Jquery Timepicker不更新angularjs指令中的模型

Question

当我按下键盘键,例如0并失去焦点时,它会自动设置为控制为00:00,但它不会更新模型值.

angular.module('test').directive('timePicker', [function () {
return {
  restrict: 'A',
  require: 'ngModel',
  scope: {
    model: '=ngModel'
  },
  link: function ($scope, element, attrs, ngModelCtrl) {

    element.timepicker({'timeFormat' : 'H:i'});

    ////element.on('change', function () {
    ////  scope.$apply(function () {
    ////    scope.model = element.datepicker('getTime');
    ////  });
    ////});


    ////$scope.$watch('model', function (newValues, oldValues, scope) {
    ////  console.log("Nothing here");
    ////});       
  }
}
}]);



<input id="startTime" type="text" name="startTime" data-ng-model="vm.data.StartTime" time-picker  />

由于模型未更新,我无法验证时间.注释代码我试图更新值.

Answer 1

发生这种情况是因为时间戳更改输入字段的值(可能使用$("input").val("newval"))不会触发角度正在侦听的任何事件以启动摘要周期.

顺便说一句,我可以找到一个你可能想要使用的angular-jquery-timepicker.看看它的源代码,看起来它正在监听一个changeTime事件:

element.on('changeTime', function () {
  $scope.$apply(function () {
    $scope.model = element.val();
  });
});

该changeTime事件也有记录(参见"事件示例").

在这个Plunkr中尝试一下.事实证明,听取这个change事件也有效.