Question

我有一个使用分页和排序的垫子表，它可以正常工作，直到放置构造函数"constructor(private _router: Router){}"为止。该表仍在显示，但分页和排序没有显示。它一次显示所有内容。我是angel的新手，无法识别问题。

我尝试将内容放置在构造函数的'ngOnInit'上，但似乎仍然无法正常工作。

export class LogsComponent implements OnInit {
  constructor(private _router: Router){} //If i place this, it works but pagination doesn't

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

  @ViewChild(MatPaginator) paginator: MatPaginator;
  @ViewChild(MatSort) sort: MatSort;
  dataSource = new MatTableDataSource(EXAMPLE_DATA);
  displayedColumns = ['id', 'name', 'role', 'date'];

  applyFilter(filterValue: string, _router: Router) {
    this.dataSource.filter = filterValue.trim().toLowerCase();
  }
}

这是我的HTML代码：

//The one I use on mg 'logs' page
<div *ngIf="_router.url == '/logs'">
   <div class="table">
      //table here
   </div>
</div>

//The on I use on the dashboard
<div *ngIf="_router.url != '/logs'">
   <div class="table">
      //table here
   </div>
</div>

我想知道为什么这行不通，我从一些页面中读取到构造函数在ngOnInit()之前先被读取。但是对于我来说，它不起作用，有人可以指出我做错了什么吗？非常感谢你！

Answer 1

您在控制台中看到任何错误吗？如果未导入路由器模块，则会看到StaticInjectorError。要解决此错误，请将以下内容添加到您的app.module.ts

import { RouterModule } from '@angular/router';


 @NgModule({
  imports: [
    ...,
    RouterModule.forRoot([])

Answer 2

首先，我注意到您拥有_router变量private，并且您正尝试从您的视图进行访问，我注意到的另一件事是您的applyFilter函数，我不明白为什么您期望使用路由器参数显然在您的课程范围内。但是，回到您的问题所在的是您的专用路由器变量，请尝试将其更改为public。

当角度出现问题时，后续步骤将被中断，因此您的分页器和排序功能已中断。

您必须先前在AppModule中导入RouterModule。

Answer 3

“您可以尝试[隐藏]而不是* ngIf和lemme知道它是否有效– Vikas 5月30日下午6:42”

@Vikas回答。谢谢！

放置我的构造函数后，对'ngOnInit'的分页和排序不起作用

3 个答案: