当数据来自后端时,如何使用Angular Material包括分页?

时间:2019-07-11 12:05:19

标签: angular angular-material

这是我的组成部分:

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


export class ObjecttableComponent implements OnInit {
  dataSource = new ObjDataSource(this.getObjService);
  displayedColumns = ['name', 'age', 'timestamp'];
  constructor(private getObjService: GetobjectsService) { }
  ngOnInit() {

  }
}
export class ObjDataSource extends DataSource<any> {
  constructor(private getObjService: GetobjectsService) {
    super();
  }
  connect(): Observable<Obj[]> {
    return this.getObjService.getObject();
  }
  disconnect() { }
}

这是我的服务正在获取我所需的数据:

import { Obj } from './models/obj.model';
@Injectable()
export class GetobjectsService {
  private serviceUrl = 'http://127.0.0.1:8000/find-object-data';

  constructor(private http: HttpClient) { }

  getObject(): Observable<Obj[]> {
    return this.http.get<Obj[]>(this.serviceUrl);
  }

}

只需使用

<mat-paginator [pageSizeOptions]="[5,10,20,30]" showFirstLastButtons> </mat-paginator>

没有工作

然后我知道要使用MatTableDataSource。

我该如何进行分页工作?

0 个答案:

没有答案