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

时间:2016-03-28 06:24:54

标签: javascript html angularjs phonegap-plugins

从json数据获取日期为2015年4月15日晚上10:15 我想在html页面中仅显示时间为晚上10:15的json响应数据 在这里我把我的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数据中获取时间。请帮我。 提前谢谢。

1 个答案:

答案 0 :(得分: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;

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