如何在事件上对jquery进行指令更新ng-model?

我正在为一个jQuery日期选择器插件制作一个AngularJS指令,它应该在datepicker日期发生变化时更新ng-model。

这是到目前为止的代码:

angular.module('bootstrap-timepicker', []).directive('timepicker', [ function() { var link; link = function(scope, element, attr, ngModel) { element.datetimepicker(); element.on('dp.change', function(event) { // update ngModel ? }); }; return { restrict: 'A', link: link, require: 'ngModel' }; } ]); 

考虑到在调用事件时scope,element,attr,ngModel不可用,如何在’dp.change’事件中更新ngModel?

谢谢!

这是肯定的,任何添加到角度的插件都不会更新角度范围的ng-model ,我们需要在它的jquery更改事件上手动执行。 在角度jquery插件中应始终使用指令绑定到DOM,因为指令确实提供了对DOM的良好控制。

正如您在问题中提到的ngModel ,在datetimepicker dp.change事件中, ngModelelementscope对象不可用,我不认为这可能在指令链接函数中是可能的,你必须做过其他事情或者你错过了在问题中解释。

对于udpating ng-model of date picker,您需要在dp.change事件中添加以下代码

 element.on('dp.change', function(event) { //need to run digest cycle for applying bindings scope.$apply(function() { ngModel.$setViewValue(event.date); }); }); 

在上面的代码中,我们从事件对象中检索更新的日期,然后分配给ng-model$viewValue视图中的实际字符串值 ),然后为了更新到每个使用此ng-model变量的地方,我们需要在指令链接函数作用域上使用$apply()手动运行摘要循环。 我们运行摘要周期背后的原因是,我们需要将该值推入ng-model变量$modalValue模型中的值,控件绑定的值 )。

工作Plunkr

如果您需要更多信息,请告诉我,我会告诉您详细信息,谢谢。