首页 文章

Angular Material Datatable不对Http请求中的数据进行排序

提问于
浏览
1

我正在使用带有Http请求的Angular Material数据表来获取数据 .

但是,它不是在数据表中对数据进行排序 .

export class ContactComponent implements OnInit, AfterViewInit {
  displayedColumns: string[] = [
    "firstname",
    "middlename",
    "lastname",
    "status",
    "dateofbirth"
  ];     
  selected;
  dataSource = new MatTableDataSource<Yuvak>();

  constructor(
    private router: Router,
    private dialogService: NbDialogService,
    private contactService: ContactService
  ) { }

  @ViewChild(MatPaginator) paginator: MatPaginator;
  @ViewChild(MatSort) sort: MatSort;

  ngOnInit() {
    this.contactService.getAllUser().subscribe(
      data => {
        this.dataSource.data = data.data.user;
      },
      error => {
        console.log("There was an error while retrieving Users !!!" + error);
      }
    )
  }

  ngAfterViewInit() {
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;
  }
      }

上面是我的ts文件 . 以前当我从本地json文件加载数据时,它在构造函数中运行良好 . 但是,现在我从GET请求获取数据 .

2 回答

  • 0

    检查您显示的列名称与您用作列 Headers 的列名称 . 其他一切看起来都不错 . 如果可能,发布您的模板文件 .

    检查你的html文件后试试这个 .

    ngOnInit() {
        this.contactService.getAllUser().subscribe(
          data => {
            this.dataSource.data = data.data.user;
    this.dataSource.paginator = this.paginator;
        this.dataSource.sort = this.sort;
          },
          error => {
            console.log("There was an error while retrieving Users !!!" + error);
          }
        )
      }
    
  • 0

    尝试用 dataSource: Yuvak[] = [] 替换 dataSource = new MatTableDataSource<Yuvak>(); 和用 this.dataSource = data 替换 this.dataSource.data = data.data.user;

相关问题