5

这可能是一个简单的问题，但我遇到了这个 datepicker的问题。问题是我将格式设置为dd/mm/yyyy带有data-date-format属性。但是，当检查我ng-model的值如下：Wed Jul 17 2013 00:00:00 GMT+0000 (Greenwich Standard Time)

我想要的是绑定到dd/mm/yyyy格式。

我怎样才能解决这个问题？

这是我的代码：

<label for="inputDateFrom">Frá</label>
<div class="control-group input-append">
    <input type="text" ng-model="booking.Booking.DateFrom" data-date-format="dd/mm/yyyy" bs-datepicker>
    <button type="button" class="btn" data-toggle="datepicker"><i class="icon-calendar"></i></button>
</div>

18.07.13 更新：

根据 rGil 的回答，我尝试使用 $scope.$watch。它工作正常，但首先它获取正确的日期（来自 getBooking() 服务函数），然后它更改为当前日期 - 这不是日期。

JavaScript 代码如下：

$scope.$watch('booking.Booking.DateFrom', function(v){ // using the example model from the datepicker docs
    $scope.booking.Booking.DateFrom = moment(v).format();
    alert(moment(v).format());
});

$scope.$watch('booking.Booking.DateTo', function(v){ // using the example model from the datepicker docs
    $scope.booking.Booking.DateTo = moment(v).format();
    alert(moment(v).format());
});

// Sækjum staka bókun
if(bookingID != null) {
    BookingService.getBooking(bookingID).then(function(data) {
        $scope.booking = data.data;
        $scope.booking.Booking.DateFrom = moment($scope.booking.Booking.DateFrom);
        $scope.booking.Booking.DateTo = moment($scope.booking.Booking.DateTo);
    });
}

然后我的HTML如下：

<label for="inputDateFrom">Frá</label>
<div class="control-group input-append">
        <input type="text" ng-model="booking.Booking.DateFrom" data-date-format="dd-mm-yyyy" bs-datepicker>
        <button type="button" class="btn" data-toggle="datepicker"><i class="icon-calendar"></i></button>
</div>

<label for="inputDateTo">Til</label>
<div class="control-group input-append">
        <input type="text" ng-model="booking.Booking.DateTo" data-date-format="dd-mm-yyyy" bs-datepicker>
        <button type="button" class="btn" data-toggle="datepicker"><i class="icon-calendar"></i></button>
</div>
4

3 回答 3

10

查看 AngularStrap 源代码，我发现如果您将（看似未记录的）属性设置date-type为“日期”之外的任何值（例如：），String这会阻止bs-datpicker将所选日期作为日期对象返回并解决问题。所以在这种情况下，它将是：

<input type="text" ng-model="booking.Booking.DateFrom" data-date-format="dd/mm/yyyy" date-type="string" bs-datepicker>

在 AngularStrapv0.7.4和v0.7.5

于 2013-11-13T09:09:33.460 回答
6

这可以在没有插件的情况下轻松完成。使用这篇文章，您可以创建一个具有正确格式的 $scope 变量。

例子：

$scope.$watch('datepicker.date', function(v){ // using the example model from the datepicker docs
    var d = new Date(v);
    var curr_date = d.getDate();
    var curr_month = d.getMonth() + 1; //Months are zero based
    var curr_year = d.getFullYear();
    $scope.modDate = curr_date + "/" + curr_month + "/" + curr_year;
    console.log($scope.modDate)
})

FORKED DEMO - 打开控制台

于 2013-07-16T04:23:39.040 回答
2

使用 AngularJS 可以通过更优雅的方式来实现它。只需使用日期过滤器 Angular。像这样：

$filter('date')(date, "yy/MM/yyyy", date.getTimezoneOffset())

$filter('date') 获取 angularjs 过滤器，它接受 args、日期、模板和时区，并返回一个格式良好的字符串。

08/03/2016
于 2016-03-08T15:13:28.467 回答