0 
public total = []
  public topScore: number
  public studentStatus



 public studentData: any[] = [
  {
  "name": "rajiv",
  "marks": {
    "Maths": 18,
    "English": 21,
    "Science": 45
  },
  "rollNumber": "KV2017-5A2"
  },
  {
  "name": "abhishek",
  "marks": {
    "Maths": 43,
    "English": 30,
    "Science": 37
  },
  "rollNumber": "KV2017-5A1"
  },
  {
  "name": "zoya",
  "marks": {
    "Maths": 42,
    "English": 31,
    "Science": 50
  },
  "rollNumber": "KV2017-5A3"
}];

这是我的总数组控制台输出

(3) [110, 84, 123]

totalScore(){
  this.studentData.forEach(a => {
    let res = a.marks.English + a.marks.Maths + a.marks.Science
    this.total.push(res)
    console.log(this.total)
  });
}

这是我的控制台输出，用于学生的主题标记数组和状态，如果任何主题 < 20 “失败”，否则“通过”

**details.component.ts:68 (3) [43, 30, 37]
details.component.ts:72 Pass
details.component.ts:68 (3) [18, 21, 45]
details.component.ts:72 Fail
details.component.ts:68 (3) [42, 31, 50]
details.component.ts:72 Pass**

status(){

  this.studentData.forEach(a => {
    let sample = a.marks
    let values = [];

    for (var key in sample) {
      values.push(sample[key]);
    };
    console.log(values);

    this.studentStatus = values.find(b => b < 20) ? "Fail" : "Pass" console.log(this.studentStatus) 
  }) 
}

这是我的 topScore 值 details.component.ts:79 123的控制台输出

topper(){
  this.topScore=Math.max(...this.total) console.log(this.topScore) 
}

此处所有控制台输出都显示正确，但在 DOM View 中所有变为绿色并且所有状态值都显示为 "pass"。如何纠正这个

4

1 回答 1

0

当你检查 DOM 时，你看到两者了吗？

<tr class="green">...</tr>
<tr class="green red">...</tr>

你不是说谁得分最高，只是说有一个。您需要区分哪个学生得分最高。此外，如果您在类中同时看到红色和绿色，这可能与您如何设置 css 样式以及哪个将优先取决于您首先列出的是 .green 类还是 .red 类，也就是说，如果它们都具有相同的 CSS 选择器深度。

所以。要么在具有 topScore = true 或 false 的学生上添加一个属性，要么让另一个类说明最高分是什么以及谁获得了最高分。从这里，你可以做类似的事情

<tr *ngFor="let data of studentData" [ngClass]="{'green':topScore.name === data.name ,'red': data.marks.Maths < 20}">
于 2019-12-30T20:02:36.807 回答