2016-02-19 7 views
7

के साथ पार्स कॉम्प्लेक्स जेसन ऑब्जेक्ट्स मैं TypeScipt के साथ जटिल जेसन ऑब्जेक्ट को कैसे पार्स कर सकता हूं?टाइपस्क्रिप्ट

मेरे पास एक ग्राहक वस्तु है, जिसके पास कुछ चालान हैं।

यह मेरा मॉडल है:

export class Customer { 
    public id: string; 
    public name: string; 
    public invoices: CustomerInvoice[]; 

    get invoicesCount(): number { 
     if (this.invoices== null) { 
      return 0; 
     } 
     return this.invoices.length; 
    } 

    constructor() { 
    } 
} 

export class CustomerInvoice { 
    public id: number; 

    constructor() { 
    } 
} 

और मेरी सेवा में मेरे पास है:

ngOnInit() { 
    if (this.id != null) { 
     this.dataService.getCustomer(this.id).subscribe(data => { 
      this.customer = data; 
     }, 
      err => console.log(err)); 
    } 
} 

ग्राहक डेटा (अपने ग्राहक आईडी, नाम आदि कुछ मान) महान हैं, लेकिन चालान अशक्त हैं ।

जेसन सही है, डेटा। चालान। लम्बाई एक संख्या लौटाती है।

+1

पर्याप्त विवरण नहीं। – dfsq

उत्तर

8

मैं टाइपससिप्ट के साथ जटिल जेसन ऑब्जेक्ट को कैसे पार्स कर सकता हूं?

मान लिया जाये कि आप वास्तविक वर्ग के बजाय उदाहरणों सरल जावास्क्रिप्ट वस्तुओं में JSON को पार्स मतलब, टाइपप्रति इस सुविधा शिप नहीं करता ऑफ-द-शेल्फ

आप जो आपको एक type-assertion (नहीं एक type- डाली) कर सकते हैं का उपयोग कर कुछ हद तक mimick को टाइप सुरक्षा अगर JSON विश्वसनीय है एक अंतरफलक घोषणा बना सकते हैं, लेकिन वह यह है - मैं कोई मूल उपकरण पता उपयोगकर्ता-परिभाषित प्रकारों के वास्तविक उदाहरणों के लिए JSON को क्रमबद्ध करने के लिए।

interface ICustomerInvoice { 
    id: number; 
} 

interface ICustomer { 
    id: string; 
    name: string; 
    invoices: ICustomerInvoice[]; 
} 

var customer: ICustomer = JSON.parse(json) as ICustomer; 

फिर भी, एक ही स्पष्ट कारणों के लिए मैं एक साथ TypedJSON डाल टाइपप्रति में इस सुविधा को लागू करने के लिए शुरू कर दिया। अपेक्षा के अनुरूप

@JsonObject 
export class CustomerInvoice { 
    @JsonMember 
    public id: number; 
} 

@JsonObject 
export class Customer { 
    @JsonMember 
    public id: string; 

    @JsonMember 
    public name: string; 

    @JsonMember({ elementType: CustomerInvoice }) 
    public invoices: CustomerInvoice[]; 

    get invoicesCount(): number { 
     if (this.invoices== null) { 
      return 0; 
     } 
     return this.invoices.length; 
    } 
} 

एक JSON स्ट्रिंग deserialize के लिए, आपको JSON.parse के बजाय TypedJSON.parse का प्रयोग करेंगे, गेटर भी उपस्थित रहेंगे:: आप JSONObject और JsonMember सज्जाकार के साथ अपने वर्गों और सदस्यों टिप्पणी कर सकते हैं

var customer = TypedJSON.parse(json, Customer); 
typeof customer.invoicesCount; // "number"  

यह है सिफारिशReflectDecorators साथ प्रयोग किया जा करने के लिए (लेकिन आवश्यक नहीं)। यदि आप इस अनुशंसा को छोड़ना चुनते हैं, तो आपको सदस्यों के लिए 'प्रकार' सेटिंग निर्दिष्ट करने की भी आवश्यकता है, उदाहरण के लिए:

@JsonMember({ type: String }) 
public id: string;