有没有更好的方法在角度数据表中显示来自 API 的 JSON 数据?

时间:2021-03-05 08:57:16

标签: html angular datatable

我正在使用角度数据表,我能够从 api 获取数据,但是即使数据在那里并且当我尝试对它们进行排序时,数据表仍显示“无记录”消息,数据正在消失.

export class SalesComponent implements OnInit {
          salesRepData: any = []; //defining Array
          constructor(private http: HttpClient) {
        
          }
          title = 'angulardatatables';
          dtOptions: any = [];
          ngOnInit() {
            this.dtOptions = {
              pagingType: 'full_numbers',
              pageLength: 3,
              processing: true,
            };
            this.fetchPosts();
          }
          private fetchPosts() {
            this.http
              .get('https:demo/api')
              .subscribe(posts => {
                if (posts) {
                  this.salesRepData = posts;
                }
              });``
            }
          }

<table class="table table-striped table-bordered table-sm row-border hover" datatable [dtOptions]="dtOptions">
        <thead>
          <tr>
            <th>
              Sales Rep
            </th>
            <th>
              Total Commission
            </th>
            <th>
              Commission earned
            </th>
            <th>
              Commission pending
            </th>
            <th>Commission paid</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let sale of salesRepData">
            <td>
              {{sale.salesrepId}}
            </td>
            <td>
              {{sale.totalCommission}}
            </td>
            <td>
              {{sale.commissionEarned}}
            </td>
            <td>
              {{sale.commissionPending}}
            </td>
            <td>
              {{sale.commissionPaid}}
            </td>
          </tr>
        </tbody>
      </table>

0 个答案:

没有答案
相关问题