angular - 创建带有排序和过滤选项的表

Question

我想创建一个带有排序和过滤选项的表。我使用 3 个组件来实现表格：App.component.ts，其中包括原始数据和根据 filter.component.html 中的 searchText 过滤原始数据的函数。然后将过滤后的数据发送到 table.component.ts 并显示在 localhost:4200/ 上的表格中。

我的代码不起作用。实际上，数据并没有显示在表格中。任何人都可以帮我找到问题吗？这在我的 plunker 代码中： https ://next.plnkr.co/edit/9jepFqtDxJrDUdLo?open=lib%2Fapp.ts&deferRun=1

标签： angular

Answer 1

我对 Plunker 不是很熟悉，但它看起来不像任何常用的 Angular 框架。我什至没有看到实际引导应用程序的函数。您还缺少您在 app.module.ts 中引用的两个包（angular-datatables 和 ngx-order-pipe），这对您的应用程序来说似乎非常重要。

最后，您使listToDisplay变量成为函数而不是数组，它不能作为*ngFor. 相反，把它变成一个吸气剂：

get listToDisplay() {
    // ...code here
}

完整的例子在这里。