2017-04-26 15 views
0

ion.WithEnterメソッドが通常起動するはずのビューに切り替えると、正しいデータがthis.itemsに渡されますが、ビューに切り替えた後に表示されません。代わりに、それは私の検索バーにionViewWillEnterは発動しません(イオン2、角2、タイスクリプト)

ionViewWillEnter方法を何かを入力した後に行います。

ionViewWillEnter() { 
      ... 
      this.http.post('http://www.example.com/select.php', creds, { 
       headers: headers 
      }) 
      .map(res => res.json().User) 

      .subscribe(
      data => this.data = data.map(user => user.Name), 
      err => this.logError(err), 
     () => console.log('Completed') 
     ); 


     this.items = this.data; 
    } 

検索バー:

getItems(ev) { 
    // Reset items back to all of the items 
    this.initializeItems(); // same code as ionViewWillEnter 

    // 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); 
     }) 
    } 
    } 

私のhtml:

事前に
<ion-searchbar (ionInput)="getItems($event)"> </ion-searchbar> 

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

感謝し、よろしく

答えて

1

Httpリクエスト(ionViewWillEnter()関数で使用しているリクエスト)は非同期です。これは、要求スコープ外のコードは、アプリケーションがサーバーに要求している間も引き続き実行されることを意味します。

ライフサイクルイベントの最後にthis.datathis.itemsに割り当てますが、これはHttp要求の外で行います。かわりにdata =>コールバック内で代入を行います。

関連する問題