当JavaScript更新输入值时，AngularJS过滤不起作用

Question

我最近几天在尝试用Angular做一些事情，但是我遇到了一个更新问题。

这是我HTML页面的一部分:

<div ng-app="monApp" ng-controller="monControleur">
Date de début : <input type="text" ng-model="date_deb" placeholder="JJ/MM/AAAA" value="" name="date_d" id="champ_date_deb" size="12" maxlength="10">&nbsp;<span id="calendarMainDeb"></span>
<script type="text/javascript">
//<![CDATA[
    calInit("calendarMainDeb", "Calendrier Deb", "champ_date_deb", "jsCalendar", "day", "selectedDay","calendarWrap1");
//]]>
</script>
<table border='1'>
<tr data-ng-repeat="evenement in mydata | entre_deux_dates:date_deb:date_fin ">
....

当我用键盘输入一个新的date_deb时，Angular会过滤显示的值。相反，如果使用JS日历来设置date_deb值，它会设置该值，但不会实现过滤，除非在JS中给予焦点并按下"space"。

这是JS更新date值的最后一部分:

field.value = dateArr[0]+'/'+dateArr[1]+'/'+dateArr[2];
field.focus();

在日历中选择日期后，我能做些什么来动态更新过滤值我不希望用户在每次选择后都要按"空格"…

我在angular (ng-model-options等)和JS中尝试了很多解决方案，但都不起作用。

Answer 1

您需要调用一个摘要循环:

 $scope.$applyAsync(function() {
         field.value = dateArr[0]+'/'+dateArr[1]+'/'+dateArr[2]; 
         field.focus();
});

这是因为angular是通过脏检查(dirty checking)来工作的——在每个摘要周期中(apply意味着为根作用域运行一个摘要)，作用域层次结构中的所有观察者都会被检查是否有变化，并在必要时进行更新。

Answer 2

你可以把你的答案放在$timeout中，因为$timeout会运行摘要循环，并从错误"$apply already running"中保存。

$timeout(function() {
     field.value = dateArr[0]+'/'+dateArr[1]+'/'+dateArr[2]; 
  });