将大数组从主要组件分离到一个新文件答案

【问题标题】：Separate big array from main component to a new file将大数组从主要组件分离到一个新文件
【发布时间】：2023-02-02 01:42:25
【问题描述】：

我是前端世界的新手，我目前正在使用打字稿处理 Angular 项目，我创建了一个数组以分配给一个对象，所以我的 TS 组件中有这样的东西：

    formOptions = []

    ngOnInit() {
        this.formOptions = [{
            id: 1,
            description: 'First name'
          },
          {
            id: 2,
            description: 'Middle name'
          }, {
            id: 3,
            description: 'Last name'
          }...etc
        }

如您所见，数组将变得非常大，有没有办法将数组移动到单独的文件，然后导入它并只分配对象？如果是这样，保存此文件路径的通用路径在哪里以及我应该使用什么扩展名？

【问题讨论】：

标签： javascript angular typescript

【解决方案1】：

尝试将数组存储在单独的 .json 文件中。然后使用 fetch 加载文件并解析 JSON。 JSON 是 Javascript 对象表示法，它将采用与您在代码中布局的数组（或对象）完全相同的方式。

[{
            id: 1,
            description: 'First name'
          },
          {
            id: 2,
            description: 'Middle name'
          }, {
            id: 3,
            description: 'Last name'
          }...etc
        }]

MDN 上的 first example 完全符合我的描述。

【讨论】：