ошибка TS2322: объектный литерал может указывать только известные свойства, а 'labels' не существует в type

#angular #typescript #angular-services

Вопрос:

У меня проблема, которую я не могу объяснить.

Я создаю службу angular с реализацией интерфейса, но она сообщает мне, что у меня ошибка, которую я не могу объяснить.

 error TS2322: Type '{ labels: string[]; datasets: { data: number[]; backgroundColor: string[]; hoverBackgroundColor: string[]; }[]; }' is not assignable to type 'DataBase[]'.

Объектный литерал может указывать только известные свойства, а ‘labels’ не существует в типе ‘DataBase[]’.

это мой код :

Interface.ts

 export interface Dashboardtwidget {
  title: string;
  widgetType: string;
  datatype: DataBase[];
}

export interface DataBase {
 labels: string[];
 datasets: {
 data: number[];
 backgroundColor: string[];
 hoverBackgroundColor: string[]
};
}

service.ts

 import {Injectable} from '@angular/core';
import {Dashboardtwidget} from '../models/dashboard';


@Injectable()
 export class DashboardService {
  data: Dashboardtwidget[] = [
  {
    title: 'Widget 1',
    widgetType: 'cardStyle1',
    datatype: {
      labels: ['A','B','C'],
      datasets: [
        {
         data: [300, 50, 100],
         backgroundColor: [
          '#FF6384',
          '#36A2EB',
          '#FFCE56'
         ],
         hoverBackgroundColor: [
          '#FF6384',
          '#36A2EB',
          '#FFCE56'
        ]
       }]
    }
  }
  }

У кого-нибудь когда-либо была эта проблема и это сообщение об ошибке?

Потому что я не вижу, откуда берется проблема

1. Опубликуйте функцию, в которой возникает ошибка… Короче говоря, вы пытаетесь присвоить объект массиву объектов.

2. Насколько я понял, вы пытаетесь назначить DataBase для DataBase[] . Объект для массива объектов.

Ответ №1:

datasets in DataBase выглядит как Array тип, когда вы объявили его как тип объекта.

Измените свой DataBase интерфейс на этот:

 export interface Dashboardtwidget {
  title: string;
  widgetType: string;
  datatype: DataBase[];
}

interface Dataset {
  data: number[];
  backgroundColor: string[];
  hoverBackgroundColor: string[];
}

export interface DataBase {
  labels: string[];
  datasets: Dataset[];
}

Вот рабочий образец StackBlitz для вашей ссылки.