2017-04-26 2 views
0

올바른 데이터를 this.items로 전달하지만 ionViewWillEnter 메서드가 일반적으로 실행해야하는 뷰로 전환 한 후에 표시되지 않습니다. 대신 내 검색 창에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.data의 할당을 this.items으로 설정하면 수명주기 이벤트가 끝났지 만 HTTP 요청의 외부에서 수행하게됩니다. 대신 data => 콜백 내에서 할당을하십시오.