AngularJs 中ngModel绑定HTML5 date数据同步问题

AngularJs 中ngModel绑定HTML5 date数据同步问题

以下代码例子中，直接将date类型的input标签与ng-model对应的变量绑定，会出现内存数据和页面数据不一致的问题。虽然AngularJS是双向数据绑定，但是如果用下面的方法，在页面更新date的内容时，内存中的$scope.testDate不会改变；在内存中更新$scope.testDate,页面上的日期也不会改变。

<input type="date" name="testDate" ng-model="testDate" placeholder="yyyy-MM-dd"/>

原因是AngularJs 的ngModel是引用绑定，而不是值绑定，那就意味着如果ngModel对应的引用对象没有变，但是引用对象的值发生了改变的话，Angular是检测不到变化的，因此不会做双向更新。对应的纠正方法就是，将日期作为变量的属性绑定到date类型的input标签，如下：

$scope.testDate = {
value: new Date();
}

<input type="date" name="testDate" ng-model="testDate.value" placeholder="yyyy-MM-dd"/>

分类: 问题追踪原文地址: https://www.cnblogs.com/developerERA/p/7018160.html