导出数组接口以避免在 Angular 中"Property 'push' does not exist on type..."的正确方法

Question

我需要导出 2 个接口，第一个是：

export interface DataEntry {
title: string,
content: string
}

现在对于第二个，我想将类导出为接口DataEntry数组。我知道我们可以在直接声明变量时做到这一点：

let data: DataEntry[] = [];

但是，我希望能够将该DataEntry[]接口导出到DataSource。以下是我的尝试：

export interface DataSource {
[index: number]: DataEntry
}

但是，当我尝试执行任何操作时，这将引发错误：

let data: DataSource = [];
//Error: Property 'push' does not exist on type 'DataSource'
data.push({ title: 'Title', content: 'Content' });

从技术上讲，接口DataSource的变量data上不存在数组操作。

导出接口数据源的正确方法是什么？

Answer 1

你应该使用类型别名

export type DataSource = DataEntry[];

Answer 2

您的数据源接口应该是这样的：-

interface DataSource extends Array<DataEntry>{}

解释

早些时候你声明了类似

导出接口数据源 { [索引：数字]：数据输入 }

这意味着数据输入的对象 您可以像声明和使用它一样

let data: DataSource = {};
dataSource[0] = {title: 'ABC', content: 'ABC'}

上面可能看起来像您在 0 索引处分配了一个对象，实际上您将 key 设置为 0，其值设置为上面的对象。

我的界面只是扩展了一个数据源数组。因为数组是一个接受泛型类型 T 的类。我把它作为数据输入传递了T。