將JSON對象數組轉換爲Observable <string[]>

我是新來的TypeScript和Angular 2，今天一直在環顧四周今天，但無法找到任何關於我試圖實現的東西。希望有人能通過提供正確的解決方案或指導來提供幫助。將JSON對象數組轉換爲Observable <string[]>

我的代碼庫的結構是這樣的：「src」下面

-src 
-pages 
    -employee 
    -employee-page.html 
    -employee-page.ts 
-service 
    -employee-service.ts

「頁」文件夾包含子文件夾，如「員工」的每個UI。在每個子文件夾中，我都有一個模板HTML文件（如employee-page.html）和相應的TypeScript文件（如employee-page.ts）。

「service」文件夾包含所有服務TypeScript文件（如employee-service.ts），這些文件將從UI子文件夾（如src/pages/employee）中的TS文件的TS文件中調用/調用。這個XXXX-service.ts文件將根據用戶的類型（演示或實際），在演示用戶的情況下發送來自同一類的虛擬數據，或者依次調用REST API來獲取真實數據服務器在真實用戶的情況下。

在員工service.ts文件，我有一個虛擬數據JSON對象和下面的相應功能：

employeeData = { 
    "employees": [ 
     { 
      "employeeName": "John Doe", 
      "employeeId": 123456, 
      "employeeDept": "Accounts", 
      "employeeExp": 8 
     }, 
     { 
      "employeeName": "John Smith", 
      "employeeId": 987654, 
      "employeeDept": "Travel", 
      "employeeExp": 12 
     } 
    ] 
}; 

getEmployees(userInfo): Observable<string[]> { 
    if(userInfo.name.toLowerCase() === 'demo_user') { 
     return this.employeeData.employees; 
    } 
    else { 
     return this.http.get(GET_EMPLOYEES_URL) 
      .map((res:Response) => res.json()) 
      .catch((error:any) => Observable.throw(error.json().error || 'Server error')); 
    } 
}

在我員工page.ts，我打電話該員工service.ts如下：

loadEmployees() { 
    this.employeeService.getEmployees(userInfo) 
     .subscribe(
      (results) => { 
       this.employees = results; 
      }, 
      (error) => { 
       this.showError(error); 
      } 
     ); 
}

的問題，我面對：

在我員工service.ts文件，下面的語句

return this.employeeData.employees;

在

「裝getEmployees（）」函數給出如下錯誤（編譯時錯誤）：

[ts] 
Type '{ "employeeName": string; "employeeId": number; "employeeDept":  
string; "employeeExp": number...' is not assignable to type 
Observable<string[]>'. 
Property '_isScalar' is missing in type '{ "employeeName": string; 
"employeeId": number; "employeeDept": string; "employeeExp": number...'.

但是，在同一個函數中，我的REST API從服務器返回相同的數據，並且工作正常。我在我的REST服務中對其進行了硬編碼，以便對其進行測試，並以此方式工作。

我知道我必須轉換「this.employeeData.employees」以滿足「Observable<string[]>」返回類型。但我無法弄清楚如何。

有人可以幫我解決這個問題嗎？

謝謝。

來源

2017-03-23 Gauzy

順便說一句：有沒有這樣的事情作爲「JSON對象」]（http://benalman.com/news/2010/03/theres-no-such-thing-as-a-json/）。 – nnnnnn

試試這個：

首先創建員工對象的接口：

interface Employee { 
    employeeName: string; 
    employeeId: number; 
    employeeDept: string; 
    employeeExp: number; 
}

現在改變你的getEmployees(...)功能是這樣的：

function getEmployees(userInfo: any): Observable<Employee[]> { // <-- changed 
    if(userInfo.name.toLowerCase() === 'demo_user') { 
     return Observable.of(employeeData.employees); // <-- changed 
    } 
    //... 
}

來源

2017-03-23 03:00:26 Diullei

工作！非常感謝您的快速響應！現在需要弄清楚「界面」是什麼以及它是如何工作的！：D – Gauzy

我很高興幫助你！在您的'employeeData'對象上，'employees'屬性是具有特定屬性的對象數組。我們只是創建一個接口來幫助我們的類型定義。有關接口的更多詳細信息，請參見：https://www.typescriptlang.org/docs/handbook/interfaces.html – Diullei

啊......現在我想我明白了Diullei。感謝您提供快速的點對點解釋和鏈接，非常感謝。我當然需要更多地瞭解TypeScript作爲語言。謝謝！ – Gauzy

將JSON對象數組轉換爲Observable <string[]>

回答

相關問題