Eigenschaft '' existiert nicht für Typ 'Objekt'. Observable abonnieren

Question

Ich habe gerade mit Angular2 begonnen und ich habe ein Problem, das ich nicht wirklich verstehen kann.

Ich habe einige Mock Daten als solche erstellt:

export const WORKFLOW_DATA: Object = 
{ 
    "testDataArray" : [ 
     { key: "1",    name: "Don Meow", source: "cat1.png" }, 
     { key: "2", parent: "1", name: "Roquefort", source: "cat2.png" }, 
     { key: "3", parent: "1", name: "Toulouse", source: "cat3.png" }, 
     { key: "4", parent: "3", name: "Peppo", source: "cat4.png" }, 
     { key: "5", parent: "3", name: "Alonzo",  source: "cat5.png" }, 
     { key: "6", parent: "2", name: "Berlioz", source: "cat6.png" } 
    ] 
}; 

, die dann in einem Dienst importiert und "beobachtet"

import { Injectable } from '@angular/core'; 

import { WORKFLOW_DATA } from './../mock-data/workflow' 
import {Observable} from "rxjs"; 

@Injectable() 
export class ApiService { 

    constructor() { } 

    getWorkflowForEditor(): Observable<Object> 
    { 
     return Observable.of(WORKFLOW_DATA); 
    } 

} 

Ich habe dann eine Komponente, die, im Konstruktor:

constructor(private apiService: ApiService) 
    { 
     this.apiService.getWorkflowForEditor().subscribe(WORKFLOW_DATA => { 
      console.log(WORKFLOW_DATA); 
      console.log(WORKFLOW_DATA.testDataArray); 
     }); 
    } 

Die erste console.log protokolliert ein Objekt des Typs Object, das die Eigenschaft testDataArray enthält.

Die zweite console.log, führt zu einem Fehler bei der Kompilierung:

Property 'testDataArray' does not exist on type 'Object'. 

Während immer noch eine Reihe von Objekten, Protokollierung [Objekt, Objekt, ..], wie beabsichtigt.

Ich verstehe wirklich nicht warum, ich bin mir sicher, dass ich etwas falsch mache, ich würde eine Erklärung lieben.

Vielen Dank für jede Hilfe!

Answer 1

Wenn Sie behaupten Tell typescript:

WORKFLOW_DATA: Object

Sie sagen, dass WORKFLOW_DATA ein einfaches Objekt ohne Attribute ist. Wenn Sie später versuchen, auf WORKFLOW_DATA.testDataArray zuzugreifen, denkt der Compiler, dass Sie den Typ falsch verwenden.

Wenn Sie die Typprüfung auf WORKFLOW_DATA möchten, müssen Sie eine Schnittstelle erstellen, die Ihr Objekt beschreibt.

Answer 2

Der Rückgabetyp, wenn Ihre Methode Observable<Object> lautet. Also, wenn Sie abonnieren, wird der Typ übergeben. Und es gibt keine testDataArray auf dem Object Typ. Sie können ein paar Dinge tun:

1. Art der Daten und Rückgabetyp unterschiedlich

   WORKFLOW_DATA: { testDataArray: any } = [] 
   
   getWorkflowForEditor(): Observable<{ testDataArray: any }> 
   

2. Oder geben Sie einfach die Antwortdaten zu any

   console.log((<any>WORKFLOW_DATA).testDataArray); 
   

Answer 3

Typoskript erwartet WORKFLOW_DATAObject hier zu sein:

.subscribe(WORKFLOW_DATA => {}) 

, weil Sie es so gesagt:

getWorkflowForEditor(): Observable<Object> 

Aber Object hat nicht testDataArray Eigenschaft ...Sie sollten entweder Typoskript sagen, dass die Daten alle Eigenschaften haben:

getWorkflowForEditor(): Observable<any> 

oder

console.log(WORKFLOW_DATA["testDataArray"]);