Property '' does not exist on type 'Object'. Observable subscribe

匿名 (未验证) 提交于 2019-12-03 03:05:02

问题:

I have just started with Angular2 and I've got an issue I cannot really understand.

I have some mock data created as such:

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" }     ] }; 

Which is then imported in a service and "observed"

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 );   }  } 

I then have a component which, in the constructor:

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

The first console.log logs an Object of type Object which contains the testDataArray property.

The second console.log, results in an error at compile time:

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

While still logging an array of objects [Object, Object, ..] as intended.

I really do not understand why, I am sure I am doing something wrong, I would love an explanation.

Thank you for any help!

回答1:

When you tell typescript:

WORKFLOW_DATA: Object

You are telling it that WORKFLOW_DATA is a plain object with no attributes. When you later try to access WORKFLOW_DATA.testDataArray the compiler thinks you misusing the type.

If you want type checking on WORKFLOW_DATA you need to create an interface that describes your object.



回答2:

Typescript expects WORKFLOW_DATA to be Object here:

.subscribe( WORKFLOW_DATA => {} ) 

because you told it so:

  getWorkflowForEditor(): Observable<Object> 

But Object doesn't have testDataArray property... You should either tell TypeScript that data can have any properties:

  getWorkflowForEditor(): Observable<any> 

or use

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


回答3:

The return type if your method is Observable<Object>. So when you subscribe, that will be the type passed. And there is no testDataArray on the Object type. You can do a couple things:

  1. Type the data and return type differently

    WORKFLOW_DATA: { testDataArray: any } = []  getWorkflowForEditor(): Observable<{ testDataArray: any }> 
  2. Or just type assert the response data to any

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


标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!