如何為Angular應用程序組織類？

Question

使用TypeScript，JavaScript，Java或其他類中的類來處理API響應的最專業方法是什么？

例如，一個應用程序需要三個資源：

• 帳戶（API：/ account /：id）
• 汽車（API：/ account /：id / cars / [：id]）
• 驅動程序（API：/ account /：id / cars /：id / drivers）

每個帳戶都有一個或多個Car ，每個汽車都有一個或多個Driver 。

我在應用程序中看到了兩種處理這些資源的方法：

1. 為每個資源（帳戶，汽車，駕駛員）創建一個類， 並將其嵌套 。 例如

    class Account { constructor( public id: number, public name: string, public age: number public cars: Car[] ) {} } class Car { constructor( public id: number, public type: string, public seats: number public drivers: Driver[] ) {} } 

   在這種情況下，API將返回一個已經嵌套的JSON響應，只需要請求一次數據即可。

2. 為每個資源創建一個類， 但不要嵌套它 。 首先僅獲取帳戶數據（調用/ account / 1234），然后在應用程序生命周期的后期獲取驅動程序（如果需要）和汽車（如果需要）。

    class Account { constructor( public id: number, public name: string, public age: number ) {} } class Car { constructor( public id: number, public type: string, public seats: number ) {} } 

   在這種情況下，API將為每個API調用僅返回主要資源數據。

因此，資源應始終嵌套在整個應用程序上並僅一次調用嗎，還是應該在應用程序中存在資源類並彼此獨立地重新加載？ 專業程序員使用哪種方式？

Answer 1

類不適用於聲明代表HTTP響應的類型。 使用界面或類型代替

從角度樣式指南

考慮將接口用於數據模型

Angular 4.3引入了使用HttpClient庫處理http請求的新方法

您可以告訴HttpClient響應的類型，以使使用輸出變得更加輕松和明顯。 您需要做的就是為響應的形狀定義一個接口，並根據該接口進行類型檢查：

    interface Post {
      title: string;
      body: string;
    };

    // ...

    constructor(private http: HttpClient) {}

    getData() {
      this.http.get<Post>(this.url).subscribe(res => {
        this.postTitle = res.title;
      });

}

因此，資源應始終嵌套在整個應用程序上並僅一次調用嗎，還是應該在應用程序中存在資源類並彼此獨立地重新加載？ 專業程序員使用哪種方式？

這完全取決於您的用例