如何動態地將json響應對象映射到實體？

我執行NG2在我的user.service.ts調用REST服務，並返回JSON這樣的：如何動態地將json響應對象映射到實體？

getUser(id: number): Promise<User> { 
    return this.http.get('http://localhost:4000/users/1') 
     .toPromise() 
     .then(response => response.json()) 
}

返回的對象是這樣的：

{ 
    "Id":"1" 
    "FirstName":"John" 
    "LastName":"Smith" 
}

我需要轉換這爲它看起來像這樣我的NG2用戶實體：

export class User 
{ 
    Id: number; 
    FirstName: string; 
    LastName: string; 
}

我想這樣做的，我可以利用作爲圖案的最通用的方法。例如，像：

var user = userResponse.map(User);

我想這讓映射自動發生，而不需要任何額外的明確codng使用反射或類似的動態技術。在ng2中做什麼是一個好方法？

來源

2017-08-01 user8334943

根據意見，似乎要避免構造在你的班級。那麼，「最簡單的」這裏的解決方案是使用Object.assign()：

getUser(id: number): Promise<User> { 
    return this.http.get('http://localhost:4000/users/1') 
    .map(res => Object.assign(new User(), res.json())) 
    .toPromise() 
}

現在你的數據是User一個實例。

演示：http://plnkr.co/edit/Gzi6tjZzTizDhlMCD1y9?p=preview（檢查控制檯）

來源

2017-08-02 07:33:00 Alex

完美答案謝謝！ – user8334943

太棒了！很高興在這裏，這是一個合適的解決方案！祝你有美好的一天，快樂的編碼！ :) – Alex

當你聲明你的類，你可以添加一個構造函數，將建立正確的類：

export class User 
{ 
    Id: number; 
    FirstName: string; 
    LastName: string; 
    constructor(obj: any) { 
     this.Id = +obj['Id']; 
     this.FirstName = obj['FirstName']; 
     this.LastName = obj['LastName'];  
    } 
}

退房this plunker看到它在行動。

設置和重置動態，你可以創建一個方法：

let user = setUser(this.userResponse); // <-- Assuming this.userResponse is the returned object 

setUser(res) { 
    return { 
    Id: +res['Id'], 
    FirstName: res['FirstName'], 
    LastName: res['LastName'] 
    }; 
}

來源

2017-08-01 21:58:20

謝謝z。我希望有更多動態的東西。例如，我希望能夠做到這一點，而無需在構造函數或其他地方顯式設置類屬性 – user8334943

這是可能的，但絕對不是最好的結構方法之一。您需要創建一個方法（如構造函數），然後使用var和obj調用該方法。如果您希望 –

謝謝z，我可以更新答案。你會不會發布你想要的備用解決方案？ – user8334943

從您的JSON對象通過他們獲取屬性鍵，然後循環和名字將它們分配給對象的屬性。

.then(json => { 
    Object.keys(json).forEach(key => user[key] = json[key]); 
});

或者像你這樣的可重複使用的功能要求：

export class User { 
    // properties 
    mapResponse(response) { 
     Object.keys(response).forEach(key => this[key] = json[key]); 
    } 
} 


getUser(id: number): Promise<User> { 
    var user = new User(); 

    this.http.get('http://localhost:4000/users/1') 
     .toPromise() 
     .then(response => response.json()) 
     .then(newUser.mapResponse); 

    return user; 
}

我從來沒有寫過打字稿之前，所以我在這裏給我最好的猜測。希望這足以讓你開始。

來源

2017-08-01 22:09:50 veratti

在我的項目，我用可觀察的，而不是承諾，我的代碼是一樣

getUser(id: number): Observable<User> { 
    return this.http.get('http://localhost:4000/users/1') 
      .map(resp=>resp.json()); 
}

如果一個承諾是需要

getUser(id: number): Promise<User> { 
return this.http.get('http://localhost:4000/users/1') 
    .map(resp=>resp.json()) 
    .toPromise() 
}

來源

2017-08-02 01:35:47

如何動態地將json響應對象映射到實體？

回答

相關問題