Jquery 如何从表行中得到角度7中最后两个值的差值？

我有一个数据表，如图所示：

我正在使用此表单添加数据：

当我使用表单添加数据时，“Reading”中的值将显示在表中的Reading列下

现在我想计算“Reading”列的新增加值和最后一个值之间的差值

并希望在Usage列下显示该差异

以下是我添加记录的代码：

 SaveMeterReading() {
    this.ObjMeterReadingModel.OrganizationId = this.AuthMember.OrganizationId.toString();
    this.ObjMeterReadingModel.CreatedBy = this.AuthMember.UserName;
    this.MeterReadingService.SaveMeterReading(this.ObjMeterReadingModel).subscribe(
      response => {
          if(response > 0){
            this.display = 'none';
            this.RefreshGrid();
            this.toastr.successToastr('Successfully Added', 'Success!');
          }
      },
      error => {
        console.log("Err " + error);
      }
    );

获取数据的代码：

GetAllMeterReading() {

    this.MeterReadingService.GetAllMeterReading().subscribe(
      response => {
        this.clients = response;
        this.chRef.detectChanges();
            const table: any = $('table');

            this.dataTable = table.DataTable({
                "order": [],
                "aoColumns": [
                  { "width": "10%","bSortable": false },
                  { "width": "30%"},
                  { "width": "20%"},
                  { "width": "20%"},
                  { "width": "20%","bSortable": false }
                ],
                "lengthChange": false
                // "dom": '<"left"f>r<t>ip'
            });
            this.countno = 'false';
      },
      error => {
        console.log("Err " + error);
      }
    );
  }

GetAllMeterReading（）{
此.MeterReadingService.GetAllMeterReading（）.subscribe(
响应=>{
这就是客户的反应；
this.chRef.detectChanges（）；
const table:any=$（'table'）；
this.dataTable=table.dataTable({
“订单”：[]，
“aoColumns”：[
{“宽度”：“10%”，“bSortable”：false}，
{“宽度”：“30%”，
{“宽度”：“20%”，
{“宽度”：“20%”，
{“宽度”：“20%”，“bSortable”：false}
],
“长度变化”：错误
//“dom”：“rip”
});
this.countno='false'；
},
错误=>{
console.log（“Err”+error）；
}
);
}

获取数据的服务：

GetAllMeterReading(): Observable<any> {
    return this.http.get(env.ROOT + "MeterReading/GetAllMeterReading").pipe(
        map((response: Response) => {
            return response.json();
        }),
        catchError((error: Response) => {
            return throwError(console.log(error));
        })
    );
  }

GetAllMeterReading（）：可观察{
返回此.http.get（env.ROOT+“MeterReading/GetAllMeterReading”）.pipe(
映射（（响应：响应）=>{
返回response.json（）；
}),
catchError（（错误：响应）=>{
返回抛出器（console.log（错误））；
})
);
}

用于在表中显示数据的HTML：

<table class="table table-hover" cellspacing="0">
                <thead>
                  <tr>
                    <th>#</th>
                    <th>Date</th>
                    <th>Reading</th>
                    <th>Usage</th>
                    <th>Action</th>
                  </tr>
                </thead>
                <tbody>
                  <tr *ngFor="let client of clients; let idx = index">
                    <td>{{idx+1}}</td>
                    <td>{{client.MeterReadingDate}}</td>
                    <td>{{client.MeterReading1}}</td>
                    <td></td>
                    <td><button class="btn btn-primary" (click)="UpdateMeterReading(client.Id)"><i
                          class="fa fa-edit"></i></button><button class="btn btn-default ml-10"
                        (click)="showConfirmBoxForDeleteMeterReading(client.Id)"><i class="fa fa-times"></i></button>
                    </td>
                  </tr>
                </tbody>
              </table>

#
日期
阅读
用法
行动
{{idx+1}}
{{client.MeterReadingDate}
{{client.MeterReading1}

---

如何在Angular 7中实现这一点？

以下内容将解决我们的问题，希望对您有所帮助

第一行：返回相同的读取值
其他行：返回当前读数与行上读数之差

              <tr *ngFor="let client of clients; let idx = index">
                <td>{{idx+1}}</td>
                <td>{{client.MeterReadingDate}}</td>
                <td>{{client.MeterReading1}}</td>
                <td [ngClass]="{'red': idx > 0 && getUsage(idx)}">{{idx>0?clients[idx].MeterReading1-clients[idx-1].MeterReading1:''}}</td>
                <td><button class="btn btn-primary" (click)="UpdateMeterReading(client.Id)"><i
                      class="fa fa-edit"></i></button><button class="btn btn-default ml-10"
                    (click)="showConfirmBoxForDeleteMeterReading(client.Id)"><i class="fa fa-times"></i></button>
                </td>
              </tr>

组件

getUsage(index): number {
  return (this.clients[index].MeterReading1 - this.clients[index - 1].MeterReading1) > 50;
}

---

为什么不创建一个服务来按索引从数据表中获取特定记录呢。保存新添加的记录后，在刷新网格之前，访问最后一条记录

记录

，并执行使用逻辑如果您可以在上复制此记录，那么我们可能可以向您展示如何工作logic@dreamweiver我已经用服务类函数更新了我的帖子以获取数据。请检查.just

{idx>0？clients[idx].MeterReading1 clients[idx-1].MeterReading1:'}

@Aamir，您共享的当前服务将获取所有记录，但您需要有一个新的服务方法来通过索引（数据表上的唯一数字）获取记录。稍后，您可以调用此方法从中获取

读取

数据以执行使用率计算

getUsage(index): number {
  return (this.clients[index].MeterReading1 - this.clients[index - 1].MeterReading1) > 50;
}