Question

我正在尝试将从休息服务返回的日期值格式化为observable。 createdOn和modifiedOn日期在我的HTML中呈现为/ Date（1298937600000）/，我希望它们格式化为dd / MM / yyyy。我看过一些类似的帖子，但似乎都没有指出我正确的方向或超出我目前对Angular 2的理解。

我正在调用我的API：

getUnLocationsList(): Observable<UnLocations[]> {

    var url = "http://localhost:5000/api/unlocations"
    return this._http.get(url)
        .map((response: Response) => <UnLocations[]>response.json().unLocations)
        .catch((error: any) => Observable.throw(error.json().error || 'Server error'));
}

从我的Angular 2组件中，然后调用getUnLocationsList（）函数，如下所示：

export class StandingDataComponent implements OnInit {

 pageTitle: string = 'UnLocation Codes';
 unLocationsList: UnLocations[];

 constructor(private _staticDataService: StaticDataService) { }

 ngOnInit() {
 this.getUnLocationsList();
 }
 getUnLocationsList() {
  this._staticDataService.getUnLocationsList().subscribe(unLocationsList => this.unLocationsList = unLocationsList),
  err => console.error(err),
  () => console.log("finished loading unlocations");

}

最后我正在使用一个简单的* ngFor来显示数据

<tbody *ngFor="let unLocation of unLocationsList | paginate: {itemsPerPage: 30, currentPage:page, id: '1'}; let i = index">
    <td style="width:100px"> {{unLocation.code}} </td>
    <td style="width:200px"> {{unLocation.name}} </td>        
    <td style="width:200px">{{unLocation.isActive}}</td>
    <td style="width:200px">{{unLocation.createdOn }}</td>
     <td style="width:200px">{{unLocation.modifiedOn }}</td>
  </tbody>

Answer 1

一种选择是使用DatePipe转换绑定的输出。这将使您的数据保持不变，这可能是可取的。它位于CommonModule中，因此您不必导入任何内容。

这样的事情：

new Date(1298937600000);
// Tue Mar 01 2011 01:00:00 GMT+0100 (W. Europe Standard Time)

否则你可以把它变成某个地方的Date对象（循环遍历它们）并使用它：

{{1}}

Answer 2

终于搞定了。管道似乎不起作用，但是，迭代列表中的每个项目（如建议的那样）就可以了。这是我的代码

private extractData(res: Response) {
    var data = res.json().unLocations || [];
    data.forEach((d) => {
        d.createdOn = new Date(parseInt(d.createdOn.substr(6)));

        if (d.modifiedOn != null)
            d.modifiedOn = new Date(parseInt(d.modifiedOn.substr(6)));
    });
    return data;
}

格式化从Observable数组返回的日期

2 个答案: