Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/heroku/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular7 素数表列排序不';行不通_Angular7_Primeng Turbotable - Fatal编程技术网

Angular7 素数表列排序不';行不通

Angular7 素数表列排序不';行不通,angular7,primeng-turbotable,Angular7,Primeng Turbotable,我已经使用素数表创建了一个角度应用程序。我已经在这里查看了Priming文档()。问题是我的表没有排序。排序图标显示出来,当我按下其中任何一个时,动画会改变,但数据不会被排序 这是我的component.ts代码 import { Component, OnDestroy, OnInit } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { DownloadService } fro

我已经使用素数表创建了一个角度应用程序。我已经在这里查看了Priming文档()。问题是我的表没有排序。排序图标显示出来,当我按下其中任何一个时,动画会改变,但数据不会被排序

这是我的component.ts代码

import { Component, OnDestroy, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { DownloadService } from '../services/download/download.service';
import { SelectItem, MultiSelectModule } from "primeng/primeng";

@Component({
  selector: 'app-downloads',
  templateUrl: './downloads.component.html',
  styleUrls: ['./downloads.component.css'],
  providers: [DownloadService]
})

export class DownloadsComponent implements OnInit {

  downloadData: any[] = [];
  cols: any[];
  columnOptions: SelectItem[];

  constructor(private http: HttpClient, private data: DownloadService) { }

  ngOnInit() {
    this.getData();
    setInterval(() => {
      this.getData();
    }, 5000);
  }

  getData() {
    this.data.GetDownloads().subscribe(data => {
      this.downloadData = data;
    });
  }
}
以及component.html的代码

<p-table [value]="downloadData" [rows]="10" [paginator]="true" sortMode="multiple" [rowsPerPageOptions]="[5,10,20]" [rowHover]="true">
  <ng-template pTemplate="header">
    <tr>
      <th style="text-align: center;" [pSortableColumn]="'Logger Name'">Logger Name
        <p-sortIcon [field]="'Logger Name'"></p-sortIcon>
      </th>
      <th style="text-align: center;" [pSortableColumn]="'Progress'">Progress
        <p-sortIcon [field]="'Progress'"></p-sortIcon>
      </th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-download>
    <tr>
      <td style="text-align: center;">{{ download.logger.name }}</td>
      <td style="text-align: center;">
        <p-progressBar [value]="download.progress"></p-progressBar>
      </td>
    </tr>
  </ng-template>
</p-table>

记录器名称
进展
{{download.logger.name}

显然,我在p-table标记中缺少了#dt[columns]=“cols”指令。填充cols字段并添加指令解决了问题