在angular中用typescript迭代json文件？

上面是我的json文件

[
        {
            "title": "Marker 1",
            "innercontent": "the Porcelain Factory"
        },
        {

            "title": "Marker 2",
            "innercontent": "The Taj Mahal "

        },
        {
            "title": "Marker 3",
            "innercontent": "Golconda Fort"
        }
]

以上内容在我的typescript文件中

这显示了一个错误，如-

import * as content from './content.json';
marker.addListener("click", () => {for(let item of content){
            if(marker.getTitle() == item.title){
              this.currentmrkr = item;
            }
          }
}

---

我们如何在angular中迭代typescript文件中的json对象，以及如何将文件导入typescript？

如果要在typescript逻辑中迭代json，比如将数据推送到firebase，可以使用名为

如果你需要更多的细节，我有一个完整的。否则，如果您在typescript中定义了一个简单的json对象，并希望在HTML中查看特定值，则可以使用以下方法：

import * as _ from 'lodash';

myfunction(json) {
    return new Promise((resolve) => {
      _.map(json, (e, i) => {
       _.keys(e).map(() => {
        this.afs.collection('library').doc('doc ' + i).set(e);
       })
      })
     resolve();
   })
  }

然后在HTML模板中：

import { Component } from "@angular/core";

@Component({
  selector: "app-some-section",
  templateUrl: "./some-section.component.html",
  styleUrls: ["./some-section.component.scss"],
})
export class SomeSectionComponent {
  users = [
    {
      name: "Jacob",
      job: "Analyst",
      city: "California",
    },
    {
      name: "John",
      job: "Founder",
      city: "New York",
    },
  ];

  constructor() {}

}

{{user.job}
{{user.name}
{{user.city}

您可以像在js中一样进行迭代。通过使用一些

for

循环或

forEach

。这是否回答了您的问题？对在迭代之后，我应该把值放在哪里，这样我就可以在ngfor中访问它们，因为ngfor是用于数组而不是对象的。它是一个对象数组。谢谢你的loadash逻辑太棒了。但是我有一个错误，你也可以看到错误。谢谢@angularnoob，你能分享你错误的细节吗？也许我能帮忙。

import * as _ from 'lodash';

myfunction(json) {
    return new Promise((resolve) => {
      _.map(json, (e, i) => {
       _.keys(e).map(() => {
        this.afs.collection('library').doc('doc ' + i).set(e);
       })
      })
     resolve();
   })
  }

import { Component } from "@angular/core";

@Component({
  selector: "app-some-section",
  templateUrl: "./some-section.component.html",
  styleUrls: ["./some-section.component.scss"],
})
export class SomeSectionComponent {
  users = [
    {
      name: "Jacob",
      job: "Analyst",
      city: "California",
    },
    {
      name: "John",
      job: "Founder",
      city: "New York",
    },
  ];

  constructor() {}

}

<div class="card" *ngFor="let user of users">
    <h3 class="job">{{ user.job }}</h3>
    <h3 class="name">{{ user.name }}</h3>
    <h3 class="city">{{ user.city }}</h3>
</div>