【问题标题】:angular/ts/json: from total records how to know the count of matching the specific valuesangular/ts/json:从总记录中如何知道匹配特定值的计数
【发布时间】:2021-03-20 20:58:23
【问题描述】:

从以下数据如何获取适用影响的计数,不适用的影响 n FYI 影响分配给嵌套记录而不是父记录。

所以,预期的结果是:

For 1st Record
    Applicable:2 Not Applicable: 1
For 2nd Record
    Applicable:1 Not Applicable: 1

db.json

[
  {
    "id": 1,
    "first_name": "Male",
    "last_name": "Record",
    "email": "male.record@gmail.com",
    "gender": "Male",
    "dob": "01-01-1987",
    "impact": "Not Applicable",
    "score": "Updated",
    "checked": false,
    "assigned_to": [
      {
        "co_score": 54,
        "dl": "CAT1",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 20,
        "dl": "CAT2",
        "sub_impact": "Not Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 99,
        "dl": "CAT1",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      }
    ]
  },
  {
    "id": 2,
    "first_name": "Female",
    "last_name": "Record",
    "email": "female.record@gmail.com",
    "gender": "Female",
    "dob": "31-12-1987",
    "impact": "Not Applicable",
    "checked": false,
    "score": "Updated",
    "assigned_to": [
      {
        "co_score": 54,
        "dl": "CAT1",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 20,
        "dl": "CAT2",
        "sub_impact": "Not Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      }
    ]
  },
  {
    "id": 3,
    "first_name": "Male",
    "last_name": "Record Another",
    "email": "male.recordanother@gmail.com",
    "gender": "Male",
    "dob": "31-10-2017",
    "impact": "Not Applicable",
    "checked": false,
    "score": 25,
    "assigned_to": [
      {
        "co_score": 100,
        "dl": "CAT3",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 2,
        "dl": "CAT2",
        "sub_impact": "Not Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      }
    ]
  },
  {
    "first_name": "Male",
    "last_name": "One More Record",
    "email": "male.onemorerecord@gmail.com",
    "gender": "Male",
    "dob": "08-08-1984",
    "impact": "Applicable",
    "id": 6,
    "checked": false,
    "score": 67,
    "assigned_to": [
      {
        "co_score": 4,
        "dl": "CAT1",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 85,
        "dl": "CAT3",
        "sub_impact": "Not Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      }
    ]
  },
  {
    "first_name": "Female",
    "last_name": "Another Record",
    "email": "female.anotherrecord@gmail.com",
    "gender": "Female",
    "dob": "2000-07-15",
    "impact": "Applicable",
    "id": 7,
    "checked": false,
    "score": 85,
    "assigned_to": [
      {
        "co_score": 34,
        "dl": "CAT3",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 55,
        "dl": "CAT2",
        "sub_impact": "Not Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      }
    ]
  },
  {
    "id": 8,
    "first_name": "New",
    "last_name": "Record",
    "email": "new.record@gmail.com",
    "gender": "Male",
    "dob": "2020-12-17",
    "impact": "Not Applicable",
    "score": 60,
    "assigned_to": [
      {
        "co_score": 94,
        "dl": "CAT1",
        "sub_impact": "Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      },
      {
        "co_score": 85,
        "dl": "CAT3",
        "sub_impact": "Not Applicable",
        "comments": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
      }
    ]
  }
]

app.component.ts

getApplicableCounts() {
this.impactCount = {applicable:0, notapplicable:0, fyi: 0}
this.allUser.forEach(row => {
  row.assigned_to.forEach(sub => {
    console.log(sub.sub_impact)
    if (sub.sub_impact === 'Applicable') {
      this.impactCount.applicable++;
    } else if (sub.sub_impact === 'Not Applicable') {
       this.impactCount.notapplicable++;
    } else if (sub.sub_impact === 'FYI') {
      this.impactCount.fyi++;
    }
  });
});
getLatestUser() {
    this.commonService.getAllUser().subscribe((response) => {
      this.allUser = response;
      this.totalRecords = this.allUser.length;
      console.log(this.totalRecords);
    })
  }
ngOnInit() {
    this.getLatestUser();
  }

我应该在我的 getLatestUser 函数中写什么来显示适用的计数:,不适用:,n fyi:

【问题讨论】:

    标签: json angular filter count rest


    【解决方案1】:

    当我解决另一个问题时,这在question 中得到了解决。要获得影响的计数,您需要添加以下变量和函数:

    impactCount = {
       applicable: 0,
       notApplicable: 0,
       fyi: 0
    };
    
    getImpactCounts() {
      this.impactCount = {applicable: 0, notApplicable: 0, fyi: 0};
    
      this.allUser.forEach(row => {
        if (row.impact === 'Applicable') {
          this.impactCount.applicable++;
        } else if (row.impact === 'Not Applicable') {
          this.impactCount.notApplicable++;
        } else if (row.impact === 'FYI') {
          this.impactCount.fyi++;
        }
      });
    }
    

    然后将其添加到html中

    <div>
      Applicable: {{impactCount.applicable}}
      Not Applicable: {{impactCount.notApplicable}}
      FYI: {{impactCount.fyi}}
    </div>
    

    然后您需要做的就是从您的getLatestUser() 函数中调用getApplicableCounts(),并且在任何时候数据发生变化(几乎是crud 调用)。这是一个有效的stackblitz,它也链接在另一个问题的评论部分。

    【讨论】:

    • 我需要您的帮助来显示嵌套节点影响而不是父节点的计数。我应该在功能上做些什么改变?
    • 我试过 getApplicableCounts() { this.impactCount = {applicable:0, notapplicable:0, fyi: 0} this.allUser.forEach(row => { if (row.sub_impact === '适用') { this.impactCount.applicable++; } else if (row.sub_impact === '不适用') { this.impactCount.notapplicable++; } else if (row.sub_impact === 'FYI') { this.impactCount .fyi++; } }); } 它没有显示计数
    • 试过 row.assigned_to.sub_impact 也没有显示结果
    • assigned_to 是一个数组。你需要遍历它们row.assigned_to.forEach(sub =&gt; {console.log(sub.sub_impact)})
    • 这个循环会在 this.allUser.forEach 循环下吗? this.allUser.forEach(row => { row.assigned_to.forEach(sub => { console.log(sub.sub_impact) if (sub.sub_impact === 'Applicable') { this.impactCount.applicable++; } else if (sub.sub_impact === '不适用') { this.impactCount.notapplicable++; } else if (sub.sub_impact === 'FYI') { this.impactCount.fyi++; } }); });
    猜你喜欢
    • 1970-01-01
    • 2012-04-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-04-05
    相关资源
    最近更新 更多