在Angular中打印json的特定信息

编程入门 行业动态 更新时间:2024-10-07 12:22:52

在Angular中打印json的特定<a href=https://www.elefans.com/category/jswz/34/1770440.html style=信息"/>

在Angular中打印json的特定信息

在这种情况下,我如何购买产品?我想在ngFor =“ let

中显示该信息

Appponent.ts

export class AppComponent {
  title = 'Bazaar';
  url = '';
  //
  items = [];

  constructor(private json: JsonService) {
    this.json.getJson(this.url).subscribe((res: any) => {
      console.log(res);

      for(let key in res)
      if(res.hasOwnProperty(key))
        this.items.push(res[key]);
    })
  }

Appponent.html

<div *ngFor="let item of items">{{item}}</div>

这是Json结构:

{
  "success": true,
  "lastUpdated": 1588676089955,
  "products": {
    "INK_SACK:3": {
      "product_id": "INK_SACK:3",
      "sell_summary": [
        {
          "amount": 5643,
          "pricePerUnit": 5.2,
          "orders": 1
        },
      ],
      "buy_summary": [
        {
          "amount": 63182,
          "pricePerUnit": 6.6,
          "orders": 2
        },
       ],

json.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class JsonService {

  constructor(private http: HttpClient) { }

  getJson(url: string){
    return this.http.get(url);
  }
}

我已经在HTML中尝试了item.products,却一无所获

回答如下:item.products是json对象,您不能将对象绑定到DOM中。如果要以字符串形式显示对象-使用JSON.stringify

<div *ngFor="let item of items">{{JSON.stringify(item.products)}}</div>

更多推荐

在Angular中打印json的特定信息

本文发布于:2024-05-07 05:48:16,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1754595.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:信息   Angular   json

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!