在 Angular > 10 中显示来自 JSON 的单个节点

Question

我想知道如何在 Angular 应用程序中显示 json 文件中的单个节点。

这是我的 data.json：

{
    "name": "John";
    "surname": "Doe
}

我想将姓氏的结果输出到一个角度分量中。所以我可以创建一个 ReadJson 组件：

export class ReadJsonComponent implements OnInit {
data: any = (data as any).default;
  constructor() {
    console.log(data.surname);
  }
  ngOnInit(): void {
  }
}

我无法在另一个组件（例如标题）上执行此操作。你能告诉我我做错了什么吗？

Answer 1

首先像这样导入JSON文件。

import myJson = require("./myJson.json");

然后将其设置在局部变量中，

 data: any = myJson;

然后在任何你想要的地方使用它。

export class AppComponent implements OnInit {
  name = "Angular";
  data: any = myJson;

  ngOnInit() {
    console.log("surname", this.data.surname);
  }
}