Question

看到我的变量<ion-tabs class="tabs-icon-top tabs-positive"> <ion-tab title="Home" icon="ion-home" href="#/tab/home"> <ion-nav-view name="home-tab"></ion-nav-view> </ion-tab> <ion-tab title="Artist" icon="ion-ios-people" href="#/tab/list"> <ion-nav-view name="list-tab"></ion-nav-view> </ion-tab> <ion-tab title="Calendar" icon='ion-calendar' href="#/tab/calendar"> <ionic-nav-view name="calendar-tab"></ionic-nav-view> </ion-tab> </ion-tabs>值在到达页面底部时不会改变。如果我把它放在开头的<ion-view view-title="Calendar"> <ion-content class="has-subheader">  <div class="bar bar-subheader item-input-inset bar-light"> <label class="item-input-wrapper"> <i class="icon ion-search placeholder-icon"></i> <input type="search" ng-model="query" placeholder="Search"> </label> </div> </ion-content> </ion-view>方法中，它会成功更改。

可能出现什么问题？

isInfinitiveScrollLoaderEnabled

Answer 1

Angular提供了一种简单的方式来收听window或document上的活动：

@Component({
  selector: 'some-class',
  // alternative to @HostListener below
  // host: {'(window:scroll)':'onScroll($event')},
  ...
})
export class SomeClass {
  private isInfinitiveScrollLoaderEnabled: boolean;

  constructor() {
    this.isInfinitiveScrollLoaderEnabled = false;
  }

  @HostListener('window:scroll', ['$event'])
  onScroll(event) {
    if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) {
      console.log('Bottom of page');
      this.isInfinitiveScrollLoaderEnabled = true;
    }
  }
}

如果有必要，请参阅Programmatically (un)register to event with Angular 2

Angular2 / TypeScript - 变量未更改

1 个答案: