Внедрение таблицы AngularMaterial с сортировкой заголовков. Я получаю эту ошибку в консоли:
ОШИБКА TypeError: Невозможно установить свойство 'sort' неопределенного в
и эта ошибка в терминале:
ошибка TS2740: в типе «MatTableDataSource» отсутствуют следующие свойства типа «Сотрудник []»: длина, всплывающее окно, push, concat и еще 24.
ошибка TS2322: тип «MatSort» не может быть назначен типу «(compareFn?: (a: Сотрудник, b: Сотрудник) => число) => Сотрудник []».
Тип «MatSort» не дает совпадения для подписи «(compareFn?: (a: Сотрудник, b: Сотрудник) => номер): Сотрудник []».
Я не могу получить от меня то, что он хочет. Буду признателен за любые подсказки!
Я использовал код из документации AngularMaterial, за исключением интерфейса для данных. Может ли это быть проблемой?
Компонент списка сотрудников
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatSort, MatTableDataSource } from '@angular/material';
import { AngularFirestore } from '@angular/fire/firestore';
import { EmployeeService } from '../shared/employee.service';
import { Employee } from '../shared/employee';
@Component({
selector: 'app-employee-list',
templateUrl: './employee-list.component.html',
styleUrls: ['./employee-list.component.scss']
})
export class EmployeeListComponent implements OnInit {
displayedColumns: string[] = ['fullname', 'position', 'mobile'];
dataSource;
@ViewChild(MatSort) sort: MatSort;
constructor(private service: EmployeeService) { }
ngOnInit() {
this.service.getEmployees().subscribe(employees => {
this.dataSource = new MatTableDataSource(employees);
console.log(this.dataSource);
});
this.dataSource.sort = this.sort;
}
}
Список сотрудников HTML
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
<!-- Position Column -->
<ng-container matColumnDef="fullname">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Full Name </th>
<td mat-cell *matCellDef="let element"> {{element.fullname}} </td>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="position">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Position </th>
<td mat-cell *matCellDef="let element"> {{element.position}} </td>
</ng-container>
<!-- Weight Column -->
<ng-container matColumnDef="mobile">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Mobile </th>
<td mat-cell *matCellDef="let element"> {{element.mobile}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
СотрудникСервис
getEmployees() {
return this.firestore.collection<Employee>('employees')
.snapshotChanges()
.pipe(
map(actions => actions.map(a => {
const data = a.payload.doc.data();
const id = a.payload.doc.id;
return { id, ...data } as Employee;
})
)
);
}
Класс сотрудника
export class Employee {
id: string;
fullname: string;
empCode: string;
position: string;
mobile: string;
}
setTimeout(() => this.dataSource.sort= this.sort);
в ngOnInit после строки console.log. - person Karthik_Siddh   schedule 18.05.2019setTimeout()
сработало? - person Karthik_Siddh   schedule 18.05.2019