wake-up-neo.com

Die Eigenschaft '' existiert nicht für den Typ 'Object'. Observable abonnieren

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

Ich habe einige Scheindaten 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" }
    ]
};

Welches wird dann in einen 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 );
        } );
    }

Das erste console.log protokolliert ein Objekt vom Typ Object, das die Eigenschaft testDataArray enthält.

Das zweite console.log führt zu einem Fehler beim Kompilieren:

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

Während weiterhin ein Array von Objekten [Objekt, Objekt, ..] wie beabsichtigt protokolliert wird.

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!

15
0plus1

Wenn Sie TypeScript mitteilen:

WORKFLOW_DATA: Object

Sie sagen es, dass WORKFLOW_DATA ist ein einfaches Objekt ohne Attribute. Wenn Sie später versuchen, auf WORKFLOW_DATA.testDataArray Der Compiler denkt, Sie missbrauchen den Typ.

Wenn Sie die Eingabe überprüfen möchten, klicken Sie auf WORKFLOW_DATA Sie müssen eine Schnittstelle erstellen, die Ihr Objekt beschreibt.

10
Mark Meyer

TypeScript erwartet WORKFLOW_DATA um Object hier zu sein:

.subscribe( WORKFLOW_DATA => {} )

weil du es so gesagt hast:

  getWorkflowForEditor(): Observable<Object>

Aber Object hat keine testDataArray -Eigenschaft ... Sie sollten TypeScript entweder mitteilen, dass Daten beliebige Eigenschaften haben können:

  getWorkflowForEditor(): Observable<any>

oder verwenden

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

Der Rückgabetyp, wenn Ihre Methode Observable<Object> Ist. Wenn Sie sich anmelden, wird dieser Typ übergeben. Und es gibt kein testDataArray für den Typ Object. Sie können ein paar Dinge tun:

  1. Geben Sie die Daten ein und geben Sie sie anders zurück

    WORKFLOW_DATA: { testDataArray: any } = []
    
    getWorkflowForEditor(): Observable<{ testDataArray: any }>
    
  2. Oder geben Sie einfach assert the response data to any ein.

    console.log( (<any>WORKFLOW_DATA).testDataArray );
    
5
Paul Samsotha