当前位置: 首页 > 面试题库 >

如何在TypeScript中迭代JSON属性

葛磊
2023-03-14
问题内容

我的问题很简单,我有一个以下JSON Typescript对象,并且我想迭代遍历JSON属性

{"work_type":"Fabricación","work_type_resp":"Mesa","looking_for":"Relación Calidad/Precio","image":"https://s3-sa-east-1.amazonaws.com/online-quotation- images/153366018967.png","width":"22","high":"34","depth":"","modifications":"mod"}

使用的代码是以下有角TypeScript组件:

export class DetailsOnlineQuoteModalComponent implements OnInit {

  @Input() title;
  @Input() values:string;
  properties:JSON;

  constructor(public activeModal: NgbActiveModal) { }

  ngOnInit() {
    this.properties=JSON.parse(this.values);
    console.log(this.properties);
  }

}

我真正需要的是遍历JSON的键值属性,并在我的HTML中显示它们。

非常感谢!


问题答案:

如果您使用的是Angular 6.1,请使用键值管道

<div *ngFor="let title of data | keyvalue">
  {{title.key}}
</div>

对于Angular 5

<div *ngFor="let key of dataKeys">
  {{key}} ------------- {{data[key]}}
</div>
get dataKeys() { return Object.keys(this.data); }

示例:https://stackblitz.com/edit/keyvalue-pipe-
qtaqnm



 类似资料:
  • 问题内容: 如何在jquery中迭代json数据。 问题答案: 您可以这样使用:

  • 如何在typescript中迭代字符串文字类型? 例如我定义这种类型 我想这样迭代 或者这在打字稿中根本不可能?

  • 我有一个(来自XML): 我想在不使用属性名称的情况下迭代属性,例如。 我已尝试按如下方式索引到对象: 但这并没有给我什么,但它也不会导致任何错误。 ############################################################################################################### 不迭代属性。 返回doc,

  • 如果要从一个数据集中获取一个数据项,可以对这个数据集进行迭代。 JavaScript 提供了许多迭代集合的方法,从简单的 for 循环到 map() 和 filter()。本节要介绍的迭代器也是一种方案,并且迭代器将迭代的概念直接带入核心语言,同时提供了一种机制来自定义 for...of 循环的行为。 1. 慕课解释 迭代器是一种特殊对象,它符合迭代器协议规范。在 TypeScript 中,我们可

  • 我目前正在努力迭代从第三方API获取的JSON对象。您可能会看到,以前没有真正处理过获取API。 这是我正在获取的JSON文件: 链接到JSON文件 为了获取数据,我使用一个useFetch脚本,它看起来像这样: 我稍后尝试导出的只是每个角色/冠军的名称(他本身就是一个对象,包括名称、描述等) 不幸的是,我在尝试转换JSON对象表示:

  • 问题内容: 假设我有这个简单的MyArray类,它有两个简单的方法:添加,删除和迭代器。在主要方法中,我们可以看到应该如何使用它: 然后应以某种方式实现MyIterator: } MyIterator应该从 MyArray 类 开始 ,从 开始 到 结束 值迭代 arr ;两者都是 MyArray的 属性。那么,由于 MyIterator 应该使用 MyArray 属性,应如何实现MyIterat