2016-08-24 141 views
0

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

这里的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); 
     } 

的controller.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> 

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

Final note: right now without the filter: 7/25/2016 12:00:00 AM want to convert to 7/25/2016

帮助,将不胜感激。

+0

你有没有尝试{{EMP。DOB | date:'MM/dd/yyyy'}} –

+0

您可能想要清除所有不相关的代码并只保留所需的内容。 –

+0

这不是“JSON字符串日期”,而只是一个字符串。 JSON不会声明任何日期数据类型。 – zerkms

回答

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(); 
    }; 
    }) 
+0

谢谢:D。像魅力一样工作。 –

2

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

在你的控制器:

$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

UPDATE

我想我知道为什么你越来越recursion错误!这是因为您的自定义过滤器的名称!您的过滤器称为date,过滤器中内置的角度也称为date。也许他们最终会互相打电话而陷入递归。只需更改名称就可以做到这一点。

+0

嗨有一个反复出现的错误说:太多的递归:(任何意见? –

+0

@AshaneAlvis你试过哪个选项?都是导致同样的错误? –

+0

嗨@Jahongir,ti2005答案为我工作。帮助我出局 –

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/

相关问题