AngularJS 数据绑定不适用于 ui-date 组件

Question

我在 AngularJS 项目中使用 ui-date 组件作为下拉日期选择器。我遇到的问题是模型和日期选择器之间的数据绑定只是单向的，而不是我期望的双向。

我的 HTML 有一个 Prev 和 Next 按钮，允许用户一次向前和向后调整日期。或者他们可以单击日期框本身以显示下拉日期选择器并指定他们想要的任何日期。

Plunker here.

HTML：

ThisDate: {{ ThisDate }}
<p>
<button ng-click="PrevDay()">&lt; Prev</button>
<button ng-click="NextDay()">Next &gt;</button>
<p>
Set Date: <input ui-date ng-model="ThisDate" id="ThisDate">

Javascript：

var app = angular.module('app', ['ui.date']);

app.controller('MyController', function($scope) {
    $scope.ThisDate = new Date();

    $scope.PrevDay = function() {
        $scope.ThisDate = DateOffset($scope.ThisDate, -1);
    };

    $scope.NextDay = function() {
        $scope.ThisDate = DateOffset($scope.ThisDate, 1);
    };

    function DateOffset(ThisDate, NumDays) {
        var d = ThisDate;
        d.setDate(d.getDate() + NumDays);
        return d
    }
});

问题：

如果您使用下拉日期选择器更改日期，日期框将更改，{{ ThisDate }} 将正确更新。但是如果你点击 Prev 或 Next 按钮，只有绑定的 {{ ThisDate }} 会改变……而不是模型中绑定到“ThisDate”的日期框。

复制步骤：

运行 Plunker。请注意，如果您单击日期框，您可以从下拉列表中更改日期，日期框将相应更改，顶部绑定到 ThisDate 的文本区域也将更改。现在单击 Next 或 Prev 按钮。请注意，只有绑定的 ThisDate 文本会更改，日期框不会更改。日期框也应该更改，因为它绑定到 ThisDate。

关于为什么 ui-date 日期选择器没有将模型中的更改注册到 ThisDate 的任何想法？

Plunker here.

Answer 1

它没有看到日期对象的变化。如果您分配一个新的日期对象，它可以工作：

function DateOffset(ThisDate, NumDays) {
    var d = new Date();
    d.setTime(ThisDate.getTime() + (NumDays * 1000 * 60 * 60 * 24));
    return d
}