首页 > 解决方案 > Angular 应用程序从后端获取大量数据,并且它们在 html 表中显示不佳

问题描述

我的应用程序是在 Angular 7 中构建的,并且具有从具有 EntityFramewrok 的 WebApi 请求数据以返回信息的服务。

问题在于,当服务接收到超过 18 位的数字字段时,它们会错误地到达(例如,数字 23434343434345353453,35 将其显示为 23434343434345353000)。我做了测试,EntityFramework 很好地加载了数据。最后,当我从我的 Angular 应用程序中插入数据时,它们可以很好地插入我需要的 18 位或 20 位数字,这是因为模型是使用 big.js 库创建的。

前端:Angular 后端:带有 ASP .NET MVC 和 EntityFramework 的 WebApi

零件

import Big from 'big.js';

export class Parametro {
    NRO_CONVENIO: string;
    FEC_INICIO_NEGOCIACION: Date;
    FEC_FIN_NEGOCIACION: Date;
    VLR_CUPO_APROBADO: Big;
    VLR_CUPO_UTILIZADO: Big;
    VLR_CUPO_APROBADO_STORAGE: Big;
    VLR_CUPO_UTILIZADO_STORAGE: Big;
    ESTADO_DISPONIBLE: string;
    ISEDIT: boolean;
}



export class ParametrosNegociacionService {
  formData: Parametro;
  list: Observable<Parametro>;
  readonly rootURL = environment.baseUrl; 

  constructor(private http: HttpClient) { }

  postParametro(formData: Parametro) {
      return this.http.post(this.rootURL + '/ParametrosNegociacion', formData);
  }

  refreshList() {
      this.http.get<Observable<Parametro>>(this.rootURL + '/ParametrosNegociacion')
    .toPromise().then(res => {
        this.list = res as Observable<Parametro>;
        this.list.forEach(element => {
          //Here the large number arrives badly
          element.VLR_CUPO_APROBADO_STORAGE = element.VLR_CUPO_APROBADO; 
        });
    });
  }
...

}

看法

<table id="dataTable" class="dataTable">
  <thead class="headerStyle">
     <tr>
       <th>Vlr Cupo Aprobado</th>
     </tr>
  </thead>
  <tbody>
    <tr class="rowStyle" *ngFor="let emp of service.list">
     <!--Here the large number showon badly -->
     <td>{{emp.VLR_CUPO_APROBADO }}</td>
    </tr>
  </tbody>
</table>

在http.get中接收到数据时,数值错位了信息。

当我对所有信息发出http.get请求时,如何正确接收大数的信息。

我抓住你必须解决这个问题的任何意见或想法

标签: c#angulartypescriptbig.js

解决方案


尝试将 VLR_CUPO_APROBAD 的类型更改为字符串,因为您不需要将此值用于算术运算,而仅用于显示。

Javascript 的问题在于对大数字的处理。

我对 PHP 有同样的问题,这对我来说是一个很好的解决方案


推荐阅读