CODEWITHSUNDEEP
angularangular-material
Stefan Michelangelo Mihajlovic
Stefan Michelangelo Mihajlovic

Reputation: 164

Trying to implement matSort in Angular 8 but sort is undefined

Trying to implement mat sort on table but sort is undefined. I tried everything i could find on documentation but nothing works. (Removed ngIf,change static to false, using ngAfterViewInit hook all without result)
I am using [hidden] to hide component. Any help would be appreciated!

---ts---

import { Component, ViewChild, Input, AfterViewInit } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { ReportResponse, ReportResponseColumnLabel } from '../../report-response.model';
import { ReportDimension } from '../../report-dimension.enum';

@Component({
  selector: 'app-reporting-table',
  templateUrl: './reporting-table.component.html',
  styleUrls: ['./reporting-table.component.scss'],
})
export class ReportingTableComponent implements AfterViewInit {
  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
  @ViewChild(MatSort, {static: true}) sort: MatSort;

  @Input()
  set reportResult(value: ReportResponse[]) {
    this.setColumns(value);
    this.dataSource.data = value;
  };

  dataSource = new MatTableDataSource<ReportResponse>();
  columns = [];

  ReportResponseColumnLabel = ReportResponseColumnLabel;


  constructor() {
  }


  ngAfterViewInit(): void {
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;
    console.log(this.sort);
  }
}

Upvotes: 0

Views: 373

Answers (1)

Gangadhar Gandi
Gangadhar Gandi

Reputation: 2252

Import the MatSortModule in app.module.ts or material.module.ts(If you have...)

imports: [
    ....        
    MatSortModule

Upvotes: 3

Related Questions