rest - आयनिक 2: रियर एपीआई के साथ आयन सर्चबार का प्रयोग करते समय खोज बार में चुने हुए परिणाम को कैसे प्रदर्शित किया जाए?



drop-down-menu ionic2 (0)

मैं एक खोज सूची के साथ एक ड्रॉपडाउन सूची बनाना चाहता हूं जिसमें एक REST API से डेटा युक्त सूची है। प्रारंभ में मैंने बनाया खोजबार में मैं केवल आइटम का चयन कर सकता था लेकिन खोजबार में यह प्रदर्शित नहीं कर सका। मुझे चयनित आइटम खोजबार में प्रदर्शित करना है। मैं उस चयनित आइटम को कैसे प्रदर्शित कर सकता / सकती हूं?

मुझे इसे प्रदर्शित करने की आवश्यकता है क्योंकि मैं एक व्यापक ड्रापडाउन सूची का निर्माण कर रहा हूं जहां पहली सूची का इनपुट दूसरी सूची में दिया जाता है

मैं आभारी रहूंगा अगर कोई मुझे ध्यान देकर कोड प्रदान कर सकता है कि POST पद्धति का उपयोग करते हुए डेटा को REST एपीआई से प्रदान किया जा रहा है। यह मेरा कार्य है जो HTML पृष्ठ में कहा जाता है। UserData एक ऑब्जेक्ट प्रकार ऑब्जेक्ट है, क्योंकि मुझे JSON डेटा प्राप्त करने की आवश्यकता है। मुझे त्रुटि कह रही है कि संपत्ति को लाइवर कैस ऑब्जेक्ट पर मौजूद नहीं हो सकता है।

    loadusers(ev:any){
  this.UserService.post('search/getusers',{}).subscribe(resp=>{
     this.userData = resp.data;
     console.log(this.userData); 
    },
    err=>{console.log(err);},
    ()=>{});

     let val = ev.target.value;

    // if the value is an empty string don't filter the items
    if (val && val.trim() != '') {
      this.userData = this.userData.filter((item) => {
        return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
      })
    }
  }

यह HTML फ़ाइल है, जहां मैं खोजबार के साथ डेटा को प्रदर्शित करने की कोशिश कर रहा हूं। मुझे यह भी नहीं पता है कि क्या चिंगेड फ़ंक्शन में शामिल करना है।

   <ion-searchbar  [(ngModel)]="mySearchInput" (ionInput)="loadusers($event)"></ion-searchbar>
<ion-content >
<ion-list radio-group [(ngModel)]="selectedValue">
<ion-item class="border" *ngFor="let val of userData">
<ion-label>{{val.name}}</ion-label>
<ion-radio class="resolvedState" value="{{val.name}}" (ionSelect)="isChanged(val)"></ion-radio>
</ion-item>
</ion-list> 

इन सुविधाओं के साथ एक खोजबार बनाने का सर्वोत्तम अभ्यास क्या है?





ionic2-select