【问题标题】:ionViewWillEnter does not fire (ionic 2, angular 2, typescript)ionViewWillEnter 不触发(离子 2,角度 2,打字稿)
【发布时间】:2017-09-24 09:35:12
【问题描述】:

我将正确的数据传递到 this.items,但切换到视图后它没有出现,此时 ionViewWillEnter 方法通常应该触发。相反,它是在我的搜索栏中输入一些内容后发生的

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 }}
...

【问题讨论】:

    标签: angular typescript ionic-framework ionic2


    【解决方案1】:

    请记住,Http 请求(您在 ionViewWillEnter() 函数中使用的请求)是异步的。这意味着请求范围之外的任何代码都将在您的应用程序发出请求时继续运行对服务器的请求。

    您在生命周期事件结束时将 this.data 分配给 this.items,但您在 Http 请求之外执行此操作。而是在 data =&gt; 回调中进行分配。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-09-27
      • 1970-01-01
      • 2018-01-20
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-02-26
      相关资源
      最近更新 更多