angularjs - 带有 Bootstrap-Datepicker 的 Angularjs：输入未被主动识别

Question

我正在尝试使用bootstrap-datepicker创建一个 AngularJS 应用程序。

这是我的 HTML：

<div id="test" class="input-append date">
  <input type="text" ng-model="datepicker.date" class="span4">
  <span class="add-on"><i class="icon-th"></i></span>
</div>
{{ datepicker.date }}

最后一行用于调试目的。当此页面运行时，日期选择器工作正常并将我选择的任何日期写入input框中。问题是，当我单击日期时，该{{ datepicker.date }}部件不会显示任何内容，直到我在input框中手动输入内容。我希望它能够主动显示我选择的任何日期。

这是一张试图解释正在发生的事情的图片：

如果可能的话，我还想在输入框中输入我自己的输入。任何选定的日期都将简单地添加到输入框中。

Answer 1

请参阅AngularJS 和scope.$apply这个相关 SO 问题的答案。

Your <input>is bound to datepicker.date，因此当您通过添加“x”直接更新它时，它会{{datepicker.date}}被更新。当您关闭 datepicker 时，不会对 AngularJS 进行任何更改，<input>因此 AngularJS 不知道重新评估表达式。scope.$apply当日期选择器关闭时，您需要显式调用。