Question

我一直无法获取具有特定参数值的JSON对象的计数，例如My JSON是

因此，我希望统计已部署和失败的进程总数，并将它们显示在字体结尾。

 [{
      "id": "102",
      "username":"User 1",
      "desc": "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s",
      "timeDeployed":"27-MAR-2019 20:21",
      "status": "Deployed"
    },
    {
        "id": "103",
        "username":"User 3",
        "desc": "Lorem Ipsum is simply dummy text of the printing and typesetting industry",
        "timeDeployed":"10-MAR-2019 20:21",
        "status": "Failed"
      },
      {
        "id": "104",
        "username":"User 2",
        "desc":"The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters",
        "timeDeployed":"28-DEC-2019 01:21",
        "status": "Deployed"
      },
      {
        "id": "108",
        "username":"User 1",
        "desc":"There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form",
        "timeDeployed":"10-JAN-2019 20:21",
        "status": "Deployed"
      }]

Answer 1

您可以使用数组reduce循环获取计数

var rawData = [{ "id": "102", "username":"User 1", "desc": "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s", "timeDeployed":"27-MAR-2019 20:21", "status": "Deployed" }, { "id": "103", "username":"User 3", "desc": "Lorem Ipsum is simply dummy text of the printing and typesetting industry", "timeDeployed":"10-MAR-2019 20:21", "status": "Failed" }, { "id": "104", "username":"User 2", "desc":"The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters", "timeDeployed":"28-DEC-2019 01:21", "status": "Deployed" }, { "id": "108", "username":"User 1", "desc":"There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form", "timeDeployed":"10-JAN-2019 20:21", "status": "Deployed" }]

var count = rawData.reduce((acc,eachData) => {
  if (eachData.status === 'Deployed') {
    acc.deployed ++
  } else {
    acc.failed ++
  }
  return acc
}, {deployed: 0, failed: 0})

console.log(count)

Answer 2

@xyz快了几秒钟。因此，扩展他的答案，这是一个Angular组件，还显示了如何将其包括在前端：

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

@Component({
  selector: 'my-app',
  template:`<ul>

      <li>Deployed items: {{ deployInfo.deployed }} </li>
      <li>Failed items: {{ deployInfo.failed }} </li>



  </ul>`

})
export class AppComponent  {

   json = [{ "id": "102", "username":"User 1", "desc": "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s", "timeDeployed":"27-MAR-2019 20:21", "status": "Deployed" }, { "id": "103", "username":"User 3", "desc": "Lorem Ipsum is simply dummy text of the printing and typesetting industry", "timeDeployed":"10-MAR-2019 20:21", "status": "Failed" }, { "id": "104", "username":"User 2", "desc":"The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters", "timeDeployed":"28-DEC-2019 01:21", "status": "Deployed" }, { "id": "108", "username":"User 1", "desc":"There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form", "timeDeployed":"10-JAN-2019 20:21", "status": "Deployed" }];

  deployInfo: {[status: string]: number}

  constructor() {

     this.deployInfo = this.json.reduce((acc, cur) => {
                                if (cur.status === 'Deployed') {
                                  acc.deployed ++
                                } else {
                                  acc.failed ++
                                }
                                return acc
                              }, {deployed: 0, failed: 0} );
  }


}

获取Angular 2/4/5/7中的JSON对象节点计数

2 个答案: