web-dev-qa-db-ja.com

Angular Ng内のJS日付フォーマットフィルター-フォーマットしないことを繰り返す

JSONからの実際の日付

enter image description here

以下のようにフォーマットする必要があります。

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

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>

しかし、それはまだ同じように表示されます。

以下のjsfiddleの例に示すように、日付を新しい日付として渡す必要があります http://jsfiddle.net/southerd/xG2t8/

Ng-repeat内でそれを行う方法を確認してください。親切にこれについて私を助けてください。前もって感謝します

angularjsangularjs-directiveangularjs-ng-repeatangular-uiangular-ui-bootstrap
12
Suraj

これに対処するために独自のフィルターを作成しました。日付フィルターは文字列を受け取ることができず、日付オブジェクトが必要です。

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

その後、あなたはすることができます：

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

UIの日時処理にmoment.jsを使用しています（Nice angular-moment bowerパッケージもあります）

使用法：

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

相対的な日付など、他にもたくさんのオプションがあります。

5
craigb

私はあなたがフィドルで示したコントローラーを更新しました、そしてここにあなたの 更新されたフィルター があります

ここでは、日付を目的の形式にフォーマットするために、Angular自体の機能である $ filter（ 'date'） を利用しました。

コントローラは次のとおりです。

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
V31