javascript - {{x.日期 |日期 :'hh:mm' }} 不起作用

Question

我从 json 数据中获取日期为 2015 年 4 月 15 日晚上 10:15我只想在 html 页面中显示 json 响应数据的时间，例如 10:15 PM这里我放了我的js函数和html代码

JS函数

function smsHistory($scope) {
    var user_id = sessionStorage.getItem('user_id');
    var authentication_key = sessionStorage.getItem('auth_id');
    $scope.loading = true;

    $.ajax({
        type: 'GET',
        // here I define a url to get api data
        url: '............/get_sms_history',
        data: {user_id: user_id, authentication_key: authentication_key},
        timeout: 5000,
        success: function (response) {
            $scope.loading = false;
            // here i parse the data in json              
            $scope.records = JSON.parse(response).records;
            $scope.$apply();
            var x = $scope.records;

            $scope.setbank = function (x) {
            };

            $scope.isSelected = function (x) {
                return $scope.selected === x;
            };
        },
        error: function (response) {
            $scope.error = true;
            $scope.$apply();
        }
    });
}

HTML 代码

<div ng-controller="smsHistory">
    <div ng-show="loading" class="loading"><img src="img/loading.gif" height="50px" width="50px"></div>
    <ons-list class="plan-list">
        // here i use ng-repeat to repeat the data if multiple records are their
        <ons-list-item modifier="chevron" class="plan" ng-repeat="x in records">
            <ons-row>
                <ons-col width="80px" class="plan-left">
                    // here i got the date value from json data
                    <div class="plan-date">{{x.date}}</div>
                    <div class="plan-duration"></div>
                </ons-col>
                <ons-col width="6px" class="plan-center" ng-style="{backgroundColor:a % 3 == 1 ? '#3399ff' : '#ccc'}">
                </ons-col>
                <ons-col class="plan-right">
                    <div class="plan-name">{{x.name}}</div>
                    <div class="plan-info">
                        <div>
                            <ons-icon icon="ion-android-textsms"></ons-icon>
                            &nbsp;{{x.phone}}
                        </div>
                        <div>
                            <span>{{x.charge}}</span>&nbsp;&nbsp;<span>{{x.balance}}</span>&nbsp;&nbsp;<span>{{x.status}}</span>
                        </div>
                        <div>
                            <ons-icon icon="fa-map-marker"></ons-icon>
                            &nbsp;{{x.destination}}<span></span>
                        </div>
                    </div>
                </ons-col>
            </ons-row>
        </ons-list-item>
        <ons-list-item></ons-list-item>
    </ons-list>
</div>

我只想使用 AngularJS 从该日期时间 json 数据中获取时间。请帮我。提前致谢。

Answer 1

更换线路

$scope.records = JSON.parse(response).records

具有以下内容:

var records = $scope.records = JSON.parse(response).records;
angular.forEach($scope.records, function(record) {
     record.date = new Date(record.date);
});
$scope.records = records;

我们基本上是将字符串日期转换为日期对象。