首页 文章

属性'' does not exist on type '对象' . 可观察的订阅

提问于
浏览 次
12

我刚刚开始使用Angular2，我遇到了一个我无法理解的问题 .

我有一些模拟数据创建如下：

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

然后将其导入服务并“观察”

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

}

然后我有一个组件，在构造函数中：

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

第一个console.log记录一个Object类型的Object，它包含testDataArray属性 .

第二个console.log，在编译时导致错误：

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

同时仍按预期记录对象数组[Object，Object，..] .

我真的不明白为什么，我确信我做错了什么，我会喜欢解释 .

感谢您的任何帮助！

angular typescript rxjs observable

3 回答

  • 17

    当你告诉打字稿时：

    WORKFLOW_DATA: Object

    你告诉它 WORKFLOW_DATA 是一个没有属性的普通对象 . 当您稍后尝试访问 WORKFLOW_DATA.testDataArray 时，编译器会认为您滥用了该类型 .

    如果要在 WORKFLOW_DATA 上进行类型检查，则需要创建描述对象的接口 .

    回复于
  • 5

    Typescript期望 WORKFLOW_DATA 在这里是 Object ：

    .subscribe( WORKFLOW_DATA => {} )

    因为你告诉过它：

    getWorkflowForEditor(): Observable<Object>

    但是 Object 没有 testDataArray 属性......您应该告诉TypeScript数据可以具有任何属性：

    getWorkflowForEditor(): Observable<any>

    或使用

    console.log( WORKFLOW_DATA["testDataArray"] );
    回复于
  • 7

    如果您的方法是 Observable<Object> ，则返回类型 . 所以当你订阅时，这将是传递的类型 . 并且 Object 类型上没有 testDataArray . 你可以做几件事：

    • 以不同方式键入数据和返回类型
    WORKFLOW_DATA: { testDataArray: any } = []

getWorkflowForEditor(): Observable<{ testDataArray: any }>
    • 或只是输入断言响应数据到 any
    console.log( (<any>WORKFLOW_DATA).testDataArray );
    回复于

相关问题