i’m trying to use search … but don’t know where the issue
my html
<ion-header no-border>
<ion-toolbar no-border hideBackButton mode="ios">
<ion-buttons start>
<button ion-button navPop>
<ion-icon class="back-icon" *ngIf=" this.Platform.dir() === 'ltr'" start name="md-arrow-round-back"></ion-icon>
<ion-icon class="back-icon" *ngIf=" this.Platform.dir() === 'rtl'" start name="md-arrow-round-forward"></ion-icon>
</button>
</ion-buttons>
<ion-title class="page-title">{{'FCLINIC' | translate:param}}</ion-title>
<ion-searchbar *ngIf="isSearchbarOpened" ShowCancelButton="true" (ionInpt)="getClinc($event)"
(ionCancel)="isSearchbarOpened=false" animated="true"></ion-searchbar>
<ion-buttons end>
<button ion-button end *ngIf="!isSearchbarOpened" (click)="isSearchbarOpened=true">
<ion-icon class="search-icon" name="ios-search"></ion-icon>
</button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content class="list-ion-content" no-border>
<ion-list class="list-view" mode="ios">
<button no-border ion-item *ngFor="let Clinic of CLinics">
<ion-avatar class="img-view" item-start>
<img [src]="Clinic.image">
</ion-avatar>
<h3 class="text-header">{{Clinic.name}}</h3>
<p class="text-info">{{Clinic.address}}</p>
<ion-icon class="rate-icon" item-end name="md-star-half">
<ion-note class="rate-num">{{Clinic.stars}}</ion-note>
</ion-icon>
</button>
</ion-list>
</ion-content>
file .ts
import {
Component
} from '@angular/core';
// import { Http } from '@angular/http';
// import { HttpClient } from '@angular/common/http';
import {
NavController,
NavParams,
Platform
} from 'ionic-angular';
@Component({
selector: 'page-clinc',
templateUrl: 'clinc.html',
})
export class ClincPage {
CLinics: any[];
ClinicText : string = '';
items : any;
public isSearchbarOpened = false;
constructor(public navCtrl: NavController, public navParams: NavParams, public Platform: Platform) {
this.CLinics = this.navParams.get('Data');
this.initializeItems();
}
initializeItems() {
this.items = this.CLinics
}
getClinic(ev : any) {
this.initializeItems();
var val = ev.target.value;
if (val && val.trim() != ''){
this.items = this.items.filter((item => {
return ( item.tolowerCase().indexof(val.tolowerCase()) > -1);
}
)
)
}
}
}