时间戳

首页 > 解决方案 > 如何在 Angular 8 中为对象和对象数组创建接口并键入脚本？

angular - 如何在 Angular 8 中为对象和对象数组创建接口并键入脚本？

问题描述

我正在尝试为对象、对象和对象数组创建一个接口。

示例界面

export interface ErateColumn {
  categories:{
    [key:string]:column[]
  }
}

interface column {
  label:string
  value:string
}

像这样的示例 API 响应

{
"categories": {
    "Basic Information": [
        { label: "Applicant Type", value: "ApplicantType" },
        { label: "Organization Name", value: "OrganizationName" },
    ],
    "FRN Lineitem": [
        { label: "Monthly_Cost", value: "Monthly_Cost" },
        ],
    "FRN status": [
        { label: "Purpose Type", value: "PurposeType" },

    ]
}
}

在此处输入图像描述

标签： angulartypescript

解决方案

您在this._erateColumn.next(columnList)方法中提供的是columnList. 并且不知何故columnList似乎是接口 ErateColumn 的单个对象，而您的 BehaviorSubject 具有 ErateColumn 类型数组。将其更改为 ErateColumn 或在this._erateColumn.next(columnList)方法中提供数组以使您的代码正常工作。

编辑

根据您的新屏幕截图，它说categories缺少属性，因此要么像这样将其设为可选

export interface ErateColumn {
  categories?:{
    [key:string]:column[]
  }
}

interface column {
  label:string
  value:string
}

或提供类别。

推荐阅读