0

嗨,我想知道如何将来自响应的 JSON 字符串日期转换为“2016 年 8 月 24 日”等格式。我做了一个 dateFilter.js 位,它没有按我预期的那样工作,所以这就是我尝试的。

这是 dateFilter.js (实际上它不起作用。错误:数据递归)

(function () {

    angular
        .module('myapp')
        .filter('date', function ($filter) {

            return function (input) {

                if (input == null) {

                    return "";
                    }
                var _date = $filter('date')(new Date(input), 'dd/MM/yyyy');

                return _date.toUpperCase();
            };
        });
})();

这是我通过服务获取 JSON 的方法(代码不完整,因为我想展示我是如何获得响应的。

function GetEmpDetails(successcallback, failcallback) {

            var req = {
                method: 'GET',
                url: 'http://localhost:2222/api/GetEmployees/GetEmployeeDetails',
                headers: {
                    'Content-Type': 'application/json'
                }
            }
            $http(req).then(successcallback, failcallback);
        }

控制器.js

(function initController() {

    EmployeeService.GetEmpDetails(function (res) {
        $scope.employeeDetails = JSON.parse(res.data);

        //console.log(res.data);

        }
    });

最后将过滤器应用于 html。

<table id="basic-datatables" class="table table-striped table-bordered" cellspacing="0" width="100">
   <thead style="text-align:match-parent">
       <tr>
           <th rowspan="1" colspan="1" style="width:195px">First Name</th>
           <th rowspan="1" colspan="1" style="width:195px">Last Name</th>
           <th rowspan="1" colspan="1" style="width:200px">Date Of Birth</th>
           <th rowspan="1" colspan="1" style="width:100px">Gender</th>
           <th rowspan="1" colspan="1" style="width:200px">Email</th>
           <th rowspan="1" colspan="1" style="width:100px">Mobile</th>
           <th rowspan="1" colspan="1" style="width:190px">Designation</th>
           <th rowspan="1" colspan="1" style="width:200px">Date of Join</th>
           <th rowspan="1" colspan="1" style="width:195px">NIC</th>
           <th rowspan="1" colspan="1" style="width:100px">Dept. Name</th>
       </tr>
   </thead>
   <tbody>
       <tr ng-repeat="emp in employeeDetails.slice(((currentPage-1)*itemsPerPage),((currentPage)*itemsPerPage))" style="text-align:center">
           <td>{{emp.fname}}</td>
           <td>{{emp.lname}}</td>
           <td>{{emp.DOB | date}}</td> //applying the filter
           <td>{{emp.gender}}</td>
           <td>{{emp.email}}</td>
           <td>{{emp.mobile_no}}</td>
           <td>{{emp.designation}}</td>
           <td>{{emp.date_of_join | date}}</td> //applying the filter
           <td>{{emp.nic}}</td>
           <td>{{emp.department_name}}</td>
       </tr>
   </tbody>
</table> 

那么我将如何做到这一点是有任何其他的转换方式。

最后说明:现在没有过滤器:2016 年 7 月 25 日上午 12:00:00 想要转换为 2016 年 7 月 25 日

帮助将不胜感激。

4

3 回答 3

1

您可以先将字符串转换为实际日期,然后应用内置日期过滤器:

在您的控制器中:

$scope.convertToDate = function(date){
      var dateOut = new Date(date);
      return dateOut;
};

在您的 html 中:

<td ng-bind="convertToDate(date) |  date:'MM/dd/yyyy'"></td>

另一个选项可以moment.js在您的过滤器中使用:

 moment(input, 'MM/dd/yyyy')

此外,您的过滤器可能无法正常工作的原因是它的名称。尝试更改为其他任何内容,例如myDate.

更新

我想我知道你为什么会recursion出错!这是因为您的自定义过滤器的名称!你的过滤器被称为date,角度的内置过滤器也被称为date。也许他们最终互相打电话并陷入递归。只需更改名称就可以解决问题。

于 2016-08-24T04:47:45.053 回答
1

试试这个代码。我认为这可以解决您的问题:

<td>{{emp.DOB | dateFormat}}</td>

角度过滤器:

.filter('dateFormat', function() {
    return function(dt) {
        var dt = new Date(dt);
        return (dt.getMonth()+1)+'/'+dt.getDate()+'/'+dt.getFullYear();
    };
  })
于 2016-08-24T05:04:10.160 回答
1

可以使用 npm 模块 moment.js 来实现。我创造了一个小提琴。看看这个。

var date = moment("7/25/2016 12:00:00 AM").date();
var month = moment("7/25/2016 12:00:00 AM").month();
var year = moment("7/25/2016 12:00:00 AM").year();
console.log(''+month+'/'+ date + '/'+ year);

https://jsfiddle.net/Refatrafi/1jq7o2uq/

于 2016-08-24T05:05:10.567 回答