角JS日期格式过滤器在Ng-Repeat不格式化。

时间:2022-08-25 09:49:23

Actual Date coming from JSON

实际日期来自JSON

角JS日期格式过滤器在Ng-Repeat不格式化。

Need to format it as below .

需要格式化如下所示。

Effective Date : 2010-08-31 (trim the time stamp)
End Date : 2010-08-31 (trim the time stamp)

Am using the below code for Formatting the date inside Ng-Repeat.

使用下面的代码格式化Ng-Repeat中的日期。

    <li ng-repeat="product in data | startFrom:currentPage*pageSize | limitTo:pageSize"
           ng-click="getAttributes(product)">   
       {{product.prod_start_date| date:'MM/dd/yyyy'}}
       {{product.prod_end_date| date:'MM/dd/yyyy'}}
    </li>

But it doesnt work still displays the same.

但它并没有显示出同样的效果。

Should the Date be passed as new Date as shown in the below jsfiddle Example http://jsfiddle.net/southerd/xG2t8/

是否应该将日期作为新日期传递,如下面的jsfiddle示例http://jsfiddle.net/southerd/xG2t8/所示

Note sure how to do that inside ng-repeat.?? Kindly help me on this. Thanks in Advance

请注意在ng-repeat中如何做到这一点?请在这方面帮助我。谢谢提前

3 个解决方案

#1


21  

I created my own filter to address this. The date filter cant take a string, needs a date object.

我创建了自己的过滤器来解决这个问题。日期过滤器不能接受字符串,需要一个日期对象。

.filter('cmdate', [
    '$filter', function($filter) {
        return function(input, format) {
            return $filter('date')(new Date(input), format);
        };
    }
]);

then you can do:

然后你可以做:

{{product.prod_start_date| cmdate:'MM/dd/yyyy'}}

#2


5  

I use moment.js for my UI date time handling (there even a nice angular-moment bower package as well)

我使用的时刻。用于我的UI日期时间处理(甚至还有一个很好的angular-moment bower包)

usage:

用法:

<span>{{product.prod_start_date | amDateFormat:'MM/dd/yyyy'}}</span>

It has a bunch of other options as well with relative dates etc.

它还有很多其他的选择,还有相对的日期等等。

#3


1  

I have updated the controller that you showed in the fiddle and here is your updated filter

我已经更新了你在古提琴上展示的控制器这是你更新的过滤器

Here I made use of the $filter('date') which is a feature of Angular itself in order to format the date in the desired format.

在这里,我使用了$filter(‘date’),它本身就是一个有角的特性,以便以所需的格式格式化日期。

Here is the controller:

这是控制器:

function Scoper($scope,$filter) {
    $scope.s = "2012-10-16T17:57:28.556094Z";
    var dateObj = new Date($scope.s);
    $scope.dateToShow = $filter('date')(dateObj,'yyyy-MM-dd');
    console.log($scope.dateToShow);
}

#1


21  

I created my own filter to address this. The date filter cant take a string, needs a date object.

我创建了自己的过滤器来解决这个问题。日期过滤器不能接受字符串,需要一个日期对象。

.filter('cmdate', [
    '$filter', function($filter) {
        return function(input, format) {
            return $filter('date')(new Date(input), format);
        };
    }
]);

then you can do:

然后你可以做:

{{product.prod_start_date| cmdate:'MM/dd/yyyy'}}

#2


5  

I use moment.js for my UI date time handling (there even a nice angular-moment bower package as well)

我使用的时刻。用于我的UI日期时间处理(甚至还有一个很好的angular-moment bower包)

usage:

用法:

<span>{{product.prod_start_date | amDateFormat:'MM/dd/yyyy'}}</span>

It has a bunch of other options as well with relative dates etc.

它还有很多其他的选择,还有相对的日期等等。

#3


1  

I have updated the controller that you showed in the fiddle and here is your updated filter

我已经更新了你在古提琴上展示的控制器这是你更新的过滤器

Here I made use of the $filter('date') which is a feature of Angular itself in order to format the date in the desired format.

在这里,我使用了$filter(‘date’),它本身就是一个有角的特性,以便以所需的格式格式化日期。

Here is the controller:

这是控制器:

function Scoper($scope,$filter) {
    $scope.s = "2012-10-16T17:57:28.556094Z";
    var dateObj = new Date($scope.s);
    $scope.dateToShow = $filter('date')(dateObj,'yyyy-MM-dd');
    console.log($scope.dateToShow);
}