1

我目前正在开发一个 Angular 2 项目,我只需要在页面上的所有元素都加载后调用特定的函数。我尝试使用 Observable 中的 eventFrom 函数,当我期待“点击”操作时它起作用了,但是一旦我切换到“加载”它根本没有触发。接下来我尝试使用 Rxjs-DOM 加载函数,但它没有也开火。

这是我现在拥有的代码:

ngAfterViewInit(): void {
  let input = this.container.nativeElement.getElementsByClassName('list-item');

  let source = Rx.DOM.load(input);

  let subscription = source.subscribe((x) => {
      console.log('Next!');
    },
    (err) => {
      console.log('Error: ' + err);
    },
    () => {
      let temp = this.container.nativeElement.getElementsByClassName('list-item');
      console.log(temp.length);
    });

}
<div class="list-wrapper">
  <div class="list">
    <div class="list-item" *ngFor="let item of items">
      <img src={{item.image}} alt="{{item.title}}">
    </div>
  </div>
</div>

 "@angular/core": "4.0.1",
    "@types/rx-dom": "^7.0.0",
    "angular2-infinite-scroll": "0.3.4",
    "gulp-run": "1.7.1",
    "rxjs": "5.2.1-smooth"

temp.length始终为 0。如果我在timeout那里设置它,它将完美地工作,因为所有元素都需要 2-3 秒才能加载,然后temp不为空。但是在这种情况下超时是不可取的。有什么我做错了吗?另一个问题是,Angular 2 中是否只有在所有 dom 元素都实际加载后才能调用函数。

Thank you in advance.

4

1 回答 1

1

try ngZone.run. It will let angular rerender for latest model.

于 2017-04-07T08:35:22.633 回答