Html Page Code:
Schedulesearch.ts file
import { Component, Injectable, OnInit, } from ‘@angular/core’;
import { HttpClient } from ‘@angular/common/http’;
import { NavController } from ‘@ionic/angular’;
import { MenuController } from ‘@ionic/angular’;
import ‘rxjs/add/operator/map’;
@Component({
selector: ‘page-schedule’,
templateUrl: ‘schedule.html’,
styleUrls: [’./schedule.scss’],
})
export class SchedulePage {
items: string;
//public items:any;
public data:any=;
// name:any(you must declare the type);
opportunity_name: any;
email:any;
first_name:any;
last_name:any;
name: any;
constructor(public navCtrl: NavController,public http: HttpClient, public menuCtrl: MenuController
) {
this.initializeItems();
this.getData();
}
ionViewWillEnter() {
this.menuCtrl.enable(true);
}
getData()
{
console.log('ENtered in Load data');
this.http.post("https://reqres.in/api/users?page=2",{})
.map(res => res)
.subscribe(data => {
// subscribe((data)=>{data},(error)=>{error})
this.data=data;
this.email=data["email"];
this.first_name=data["first_name"];
this.last_name=data["last_name"];
console.log(data);
// console.log(data['name']);
},
(error:any)=>{
console.error(error)
}
)}
initializeItems() {
this.items = [
this.data['email'],
this.data['first_name'],
this.data['last_name'],
];
console.log("kkkkkkkkkkkkkkkkkkkkkkkk="+this.getData);
// console.log(this.items);
}
getItems(ev: { target: { value: any; }; }) {
// Reset items back to all of the items
this.initializeItems();
this.getData();
console.log(this.initializeItems);
// set val to the value of the ev target
var val = ev.target.value;
// if the value is an empty string don't filter the items
if (val && val.trim() != '') {
this.items = this.items.filter((item) => {
return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
})
}
if (val && val.trim() != '') {
this.data = this.data.filter((getData) => {
return (getData.toLowerCase().indexOf(val.toLowerCase()) > -1);
})
}
}
}