कोणीय 2 दिनांक deserialization

Question

मेरे पास एक कोणीय 2 अनुप्रयोग है। एक सेवा एक API ऐसे ही परिणाम देता है से अनुरोध डेटा है निम्नलिखित:

{ 
    "data":[ 
     {"id":1,"timestamp":"2016-04-17T19:52:53.4510935+01:00","sourceDatabaseServer":"127.0.0.1","sourceDatabaseName":"Database1","targetDatabaseServer":"192.168.99.101","targetDatabaseName":"Database2"}, 
     {"id":2,"timestamp":"2016-04-17T19:52:53.4510935+01:00","sourceDatabaseServer":"127.0.0.2","sourceDatabaseName":"Database3","targetDatabaseServer":"192.168.99.102","targetDatabaseName":"Database4"}, 
     {"id":3,"timestamp":"2016-04-17T19:52:53.4510935+01:00","sourceDatabaseServer":"127.0.0.3","sourceDatabaseName":"Database5","targetDatabaseServer":"192.168.99.103","targetDatabaseName":"Database6"} 
    ] 
} 

मेरे कोणीय 2 सेवा (मैं संक्षिप्तता के लिए से निपटने त्रुटि काट लिया के रूप में हम खुश पथ पर यहाँ हो) इस तरह दिखता है :

getList() : Observable<SomeModel[]> { 
    return this._http.get(this._getListUrl).map(this.extractData); 
} 

private extractData(res: Response) { 
    return res.json().data || {}; 
} 

और इस तरह मेरी घटक:

results: SomeModel[]; 
errorMessage: string; 
ngOnInit() { 
    this._someService.getList() 
     .subscribe(
     results => this.results = results, 
     error => this.errorMessage = <any>error); 
} 

और अपने मॉडल इस तरह:

export class SomeModel { 

    constructor(
     public id: number, 
     public timestamp: Date, 
     public sourceDatabaseServer: string, 
     public sourceDatabaseName: string, 
     public targetDatabaseServer: string, 
     public targetDatabaseName: string 
    ) { } 
} 

सब कुछ है जैसे कि यह काम कर रहा था लेकिन देखा जब मैं इतना {{item.timestamp | date:'short'}} तरह DatePipe का उपयोग कर टाइमस्टैम्प प्रदर्शित करने के लिए आवेदन निम्न त्रुटि संदेश के साथ चल रही है की कोशिश की: मुझे विश्वास है कि टाइमस्टैम्प वास्तव में नहीं है

Invalid argument '2016-04-17T19:40:38.2424240+01:00' for pipe 'DatePipe' in [{{result.timestamp | date:'short'}} 

कुछ जांच के बाद Date प्रकार में परिवर्तित किया जा रहा है, लेकिन इसके बजाय बस string सेट किया जा रहा है। मुझे लगता है कि यह Date प्रकार Response.json() पर ज्ञात नहीं है? या मैं पूरी तरह से कुछ और याद कर रहा हूँ? क्या इसके लिए कोई फिक्स या काम है?

Answer 1

मैं एक तारीख से एक के लिए स्ट्रिंग फ़ील्ड को मैप होगा:

getList() : Observable<SomeModel[]> { 
    return this._http.get(this._getListUrl).map(this.extractData); 
} 

private extractData(res: Response) { 
    var data = res.json().data || []; 
    data.forEach((d) => { 
    d.timestamp = new Date(d.timestamp); 
    }); 
    return data; 
} 

Answer 2

date पाइप केवल Date नहीं मान स्ट्रिंग मान स्वीकार करता है।

JSON में तिथियों को परिवर्तित करने के लिए How to get Date object from json Response in typescript देखें।

वैकल्पिक रूप से आप अपने खुद के स्ट्रिंग करने की तारीख रूपांतरण पाइप

@Pipe({name: 'toDate'}) 
export class StringToDate implements PipeTransform { 
    transform(value, [exponent]) : number { 
    if(value) { 
     return new Date(value); 
    } 
    } 
} 

और फिर बना सकते हैं की तरह

{{item.timestamp |toDate | date:'short'}} 

सुझाव इसका इस्तेमाल: पर pipes: [StringToDate] के पाइप को जोड़ने के लिए भूल नहीं है @Component(...) सजावट जहां आप इसका उपयोग करना चाहते हैं।

भी

• https://github.com/angular/angular/pull/8038
• https://github.com/angular/angular/pull/7794

Answer 3

देखें JSON किसी भी तारीख विनिर्देश प्रदान नहीं करता है, तो यह पूरी तरह से है कि यह कैसे धारावाहिक है/deserialized पर निर्भर है।

आप JSON.parse की reviver पैरामीटर इस्तेमाल कर सकते हैं:

this._http.get(this._getListUrl).map(res => JSON.parse(res.text(), this.reviver)); 

reviver(key, value):any 
{ 
    if('timestamp' === key){ 
     //you can use any de-serialization algorithm here 
     return new Date(value); 
    } 
    return value; 
} 

Answer 4

आप के लिए अपने काम करता है, तो मेरी उदाहरण बाहर की कोशिश करो। और यहां Date और Pipe के लिए दस्तावेज़ हैं।

<span>Date : {{announcement.createdAt | date:'EEE, d MMM,y'}}</span> 
<span>Time : {{announcement.createdAt | date:'shortTime'}}</span> 

आउटपुट:

Date : Tue, 20 Dec,2016  
Time : 2:22 PM