javascript - 从 js 代码中清除 Kendo DatePicker 时，Angular 模型未更改

Question

我有html并希望在用户按“删除”按钮时清除值

我的代码:

    var handleDateKeyDown = () => {
        $('input[kendo-date-picker]').each((i, el) => {
            $(el).keydown((ev) => {
                ev.preventDefault();
                if (ev.key === "Delete") {
                    $(el).data("kendoDatePicker").value(null);
                }
                return false;
            });
        });
    }

UI部分有效，这段代码清除了kendoDatePicker值，但模型没有改变，有一些简单的解决方案来清除kendoDatePicker值和 Angular 模型值吗？我无法使用$scope.Pile.Date = null;因为我想将此方法绑定(bind)到页面上的所有日期选择器...

编辑:下面缺少 html:

<input kendo-date-picker k-ng-model="Pile.Date" ng-blur="Save()" />

Answer 1

这是我能想到的某种解决方案(当然不是最好的)

plnkr手动清空模型

        $('input[kendo-date-picker]').each((i, el) => {
        $(el).keydown((ev) => {
            ev.preventDefault();
            if (ev.key === "Delete") {
                $scope.dateString = null
                $(el).data("kendoDatePicker").value(null);
                $scope.$apply()

            }
            return false;
        });
     });   

另一个解决方案:添加删除按钮处理程序作为指令:

app.directive('del',function(){
 return {
 restrict:'A',
 scope:{ngModel:'='},
 link:function(scope,el,attrs){
   el.keydown((ev) => {

     scope.$apply(()=>{
       $(el).data("kendoDatePicker").value(null);  
       scope.ngModel = null;          

     })
   })
 }
}
}) 

plnkr