как мы можем напечатать данные атрибутов поля в angular

Question

[
    {
      "model":"products.productstable",
      "pk":1,
      "fields":{
         "company":"STANDARD",
         "description":"CHAKKARS BIG ",
         "type":"Chakkars",
         "productcase":1,
         "quantity":100,
         "units":"PKT",
         "rate":150.0,
         "retension":3.0,
         "newrate":154.5,
         "myretension":30.0,
         "finalrate":200.85,
         "retailrate":401.7,
         "remarks":"ABC"
      }
   },
   {
      "model":"products.productstable",
      "pk":2,
      "fields":{
         "company":"STANDARD",
         "description":"SMALL",
         "type":"Sparkler",
         "productcase":1,
         "quantity":100,
         "units":"PKY",
         "rate":100.0,
         "retension":3.0,
         "newrate":103.0,
         "myretension":25.0,
         "finalrate":128.75,
         "retailrate":257.5,
         "remarks":"SCDC"
      }
   }
]

Answer 1

Если вы хотите отобразить в шаблоне, вы можете использовать * ngFor как

<div *ngFor="let item of name">
    <h2>Company: {{item.fields?.company}}</h2>
    <p>Description: {{item.fields?.description}}</p>
    <p>Type: {{item.fields?.type}}</p>
    <p>Rate: {{item.fields?.rate}}</p>
</div>

Демо https://stackblitz.com/edit/angular-ejf6dw

Answer 2

Вы можете просто сделать вызов API и отобразить результат, чтобы получить атрибуты pk и field.

 this.myService.getFromAPI().subscribe(response => {
  if (response && response.length) {
    this.formattedResponse = response.map(item => {
      return {
        pk: item.pk,
        fields: item.fields
      };
    });
    console.log('rs', this.formattedResponse);
  }
});

Полный демонстрационный код: https://stackblitz.com/edit/angular-c9ppa9

Answer 3

Вы можете просто использовать функцию карты es6 для создания экземпляра вашего массива и извлечения полей данных.

export class SomeComponent implements Oninit{
ngOnInit(){}
someData = 

[{"model": "products.productstable", "pk": 1, "fields": {"company": "STANDARD", "description": "CHAKKARS BIG ", "type": "Chakkars", "productcase": 1, "quantity": 100, "units": "PKT", "rate": 150.0, "retension": 3.0, "newrate": 154.5, "myretension": 30.0, "finalrate": 200.85, "retailrate": 401.7, "remarks": "ABC"}}, {"model": "products.productstable", "pk": 2, "fields": {"company": "STANDARD", "description": "SMALL", "type": "Sparkler", "productcase": 1, "quantity": 100, "units": "PKY", "rate": 100.0, "retension": 3.0, "newrate": 103.0, "myretension": 25.0, "finalrate": 128.75, "retailrate": 257.5, "remarks": "SCDC"}}]

// create a function within your class like

showfields(){
const fields = this.someData.map((data) => console.log(data.fields));
return fields;
}

// Call the showfield() function to perform the task

}

Демо: https://stackblitz.com/edit/angular-tpxp1j