Question

我正在关注本教程： https://www.joshmorony.com/high-performance-list-filtering-in-ionic-2/

这是我的search.html

<ion-header>
    <ion-navbar>
        <ion-title>search</ion-title>
    </ion-navbar>
    <ion-toolbar primary >
        <ion-searchbar [(ngModel)]="searchTerm" [formControl]="searchControl" ></ion-searchbar>
    </ion-toolbar>
</ion-header>

<ion-content padding>
        <ion-list>
            <ion-item *ngFor="let item of items" >
                {{ item.name}}
            </ion-item>
        </ion-list>  
</ion-content>

这是我的search.js

mport { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,ViewController } from 'ionic-angular';
import { DataListProvider } from '../../../providers/data-list/data-list';
import { KeysPipe } from '../../../providers/pipes/pipes';
import 'rxjs/add/operator/debounceTime';
import { FormControl } from '@angular/forms';



@IonicPage()
@Component({
    selector: 'page-country-list-modal',
    templateUrl: 'country-list-modal.html',
})
export class searchPage {

    items=[]
    items1=[]

    searchTerm: string = '';
    searchControl: FormControl;
    searching: any = false;



    constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController, public dataListProvider : DataListProvider) {
        this.searchControl = new FormControl();
    }


    ngOnInit() {
        console.log ('1234')
        this.items1=JSON.parse(localStorage.getItem("countryList"))

        for(let key in this.items1) {
            if (key == "")
            {

            }else{
                this.items.push({ 'name':  this.items1[key] }); 
            }
        }
    }

    ionViewDidLoad() {

        this.setFilteredItems();

        this.searchControl.valueChanges.debounceTime(700).subscribe(search => {

            this.setFilteredItems();

        });
    }


    setFilteredItems()
    {
        if (this.searchTerm) {

            return this.items.filter(item => {
                 return item.name.toLowerCase().indexOf(this.searchTerm.toLowerCase()) > -1;
            });
        } else {
            return this.items;
        }
    }


}

但问题是它根本没有在列表中排序。我该如何解决这个问题

我的项目看起来像

[{ “名称”： “加拿大”}，{ “名称”： “日本”} ....]

Answer 1

let pmx = require('pmx').init({ network: true, ports: true }); let Probe = pmx.probe(); let errors = 0; const metric = Probe.metric( { name : 'Errors', value : ()=> { return errors; } }, { name: 'Memory usage', value: ()=> { return memory_usage; } } ); function incrementErrorCounter() { errors++; } module.exports = incrementErrorCounter;函数只返回已过滤的数组，而不是修改原始数组。你需要这样做：

filter

并使用filteredItems =[]; setFilteredItems() { if (this.searchTerm) { this.filteredItems = this.items.filter(item => { return item.name.toLowerCase().indexOf(this.searchTerm.toLowerCase()) > -1; }); } else { this.filteredItems = this.items; } }生成模板中的项目

Ionic 2列表没有过滤

1 个答案: