如何使用angular2解决离子2应用中的错误？

Question

大家如何使用angular2修复离子2应用程序中的bug，实际上我开发了离子2应用程序，我们尝试过滤list of items in list page，因此我们使用了{{1} }，我们在type script codes中遇到了一些错误，并且在移动应用程序中也没有过滤项目列表，我们也不知道我们在哪里犯了错误，所以请检查下面给出的图片并帮助我们解决此错误。感谢..

我的类型脚本代码： -

visual studio code

• 此行 let searchTerm: string = ''; this.activitys = data.items.sort((a, b) => { return this.activitys.filter((activity) => { return activity.name.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1; }); });
中发生错误

我的HTML代码： -

this.activitys = data.items.sort((a, b) => {

需要在给定字段下方进行过滤： -

<ion-searchbar [(ngModel)]="searchTerm" (ionInput)="loadActivitysWithAuth()"></ion-searchbar>

• 我们知道我们在类型脚本中遇到了一些<h2 (click)="gotoResourceListPage(activity)">{{activity.name}}</h2> 错误，所以请检查并更新解决方案，谢谢......

Answer 1

如果您尝试对筛选列表进行排序：

let searchTerm: string = '';
    this.activitys = data.items.filter((activity) => {
        return activity.name.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1;
    }).sort(/*sort comparison function*/);

Sort采用比较函数，基本上是交换条件。

Answer 2

您需要在另一个函数中返回以下函数，并在HTML文件中调用

filterItems(searchTerm): void {
            this.activitys = [];
            this.userPoolsAuthClient.getClient().activitysList().subscribe(
              (data) => {
                this.activitys = data.items.filter((activity) => {
                  return activity.name.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1;
                });
              });

     }

在HTML中调用以下函数

setFilteredItems() {

  return this.filterItems(this.searchTerm);

}

你的HTML就像这样

<ion-searchbar [(ngModel)]="searchTerm" (ionInput)="setFilteredItems()"></ion-searchbar>