Question

我在$ scope变量上有一个观察器，它引发一个函数来将$ scope变量更改为所选日期的周开始。该函数返回正确的日期，但是当我尝试将$ scope变量设置为该日期时，视图不会更新。但是在检查器中检查$ scope变量是否已更改但视图永远不会更新。这是$ watch函数：

angular.module('hansenApp', ['ngAnimate', 'ui.bootstrap']);
angular.module('hansenApp').controller('DatepickerCtrl', function ($scope) {
    $scope.startDate = new Date();
    $scope.endDate = new Date();

    $scope.status = {
        startOpened: false,
        endOpened: false,
    };

    $scope.openStart = function ($event) {
        $scope.status.startOpened = true;
    };

    $scope.openEnd = function ($event) {
        $scope.status.endOpened = true;
    };

    $scope.$watch('startDate', function (dateVal) {
        var oldDate = new Date(dateVal);
        var tempDate = getStartDateOfWeek(dateVal);

        if (oldDate.getTime() != tempDate.getTime()) {
            $scope.startDate = tempDate;
        }
    });

    $scope.$watch('endDate', function (dateVal) {
        var oldDate = new Date(dateVal);
        var tempDate = getEndDateOfWeek(dateVal);

        if ($scope.endDate.getTime() != tempDate.getTime()) {
            $scope.endDate = tempDate;
        }
    });

    function getStartDateOfWeek(date) {
        var ISOweekStart = date;
        ISOweekStart.setDate(date.getDate() - date.getDay());
        return ISOweekStart;
    }

    function getEndDateOfWeek(date) {
        var ISOweekEnd = date;
        ISOweekEnd.setDate(date.getDate() + (6 - date.getDay()));
        return ISOweekEnd;
    }
});

编辑1：以下是视图：

<p class="input-group">
    <input type="text" id="endDate" class="form-control" uib-datepicker-popup="MM/dd/yyyy" ng-model="endDate" is-open="status.endOpened" close-text="Close" placeholder="End Date:" runat="server" />
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="openEnd($event)"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</p>

Answer 1

您不会更改日期的引用，只会更改它的值。

日期是javascript中的对象，因此如果您不更改引用（用新的Date（）对象替换它），角度变化检测器将不会再次触发。因此，您必须使用给定属性的全新javascript日期实例替换startDate。

所以替换

var ISOweekEnd = date;

通过

var ISOweekEnd = new Date();

范围变量未在$ scope中更新。$ watch

1 个答案: