Bootstrap Datepicker不会向ng-model发送任何内容

Question

我正在编写一个简单的待办应用程序，该应用程序具有待办事项标题，任务说明和用于选择到期日期的引导日期选择器的三部分形式；

<form>
  <div class="form-group">
    <p><input type="text" class="form-control input-lg text-center" placeholder="Title" ng-model="formData.title"></p>
    <p><input type="text" class="form-control input-lg text-center" placeholder="Description" ng-model="formData.description"></p>
    <p><input type="text" class="form-control input-lg datepicker"  placeholder="Due Date" ng-model="formData.duedate"></p>
  </div>
  <button type="submit" class="btn btn-primary btn-lg" ng-click="createTodo()">Add</button>
</form>

在HTML的更下方是datepicker的JS，它可以很好地呈现。

<script>
    $('.datepicker').datepicker({
      format: 'dd/mm/yyyy',
      startDate: '+3d'
    });
</script>

当我选择任务的截止日期时，它将使用该日期填充该字段。 提交然后发送未使用我的Bootstrap日期选择器绘制的字段的表单数据（即仅仅是文本输入），但是formData.duedate是未定义的。 我不能将此绑定到Angular模型吗？ 它是否剥离了所有自定义字段类型的内容？

Answer 1

一位朋友解释了这一点。

从日期选择器中选择日期不会更新作为其基础的实际Angular模型，而只是更新文本框的内容。 修改绘制日期选择器的功能；

$('.datepicker').datepicker({
    format: 'dd/mm/yyyy',
    startDate: '+3d',
    onSelect: function(dateText, inst) {
      console.log(dateText, inst);
      $scope.formData.duedate = new Date(inst.currentYear, inst.currentMonth, inst.currentDay);
    }
  });

单击模型时更新模型（选择日期需要这样做），从而很好地传递模型。