首页 文章

Ionic 2 ionScroll事件不刷新视图

提问于
浏览 次
2

我添加了 <ion-content> 一个ionScroll事件，该事件触发方法 foo() ，并在 <button ion-button> 点击事件中触发 foo() . 在我的模板中，我添加了一个示例 {{ x }} ， foo() 方法增加了 x .

单击按钮会刷新视图，以便显示新值 . 滚动没有 . 如果我添加一个 console.log ，这将打印 .

如果我将fokus设置为某个元素（如文本框或其他内容），则视图会刷新并显示 x 的新值 .

有人知道为什么？

angular typescript ionic2 ionic3

1 回答

  • 4

    这是因为非常有趣和强大的东西叫 Zones . 如果这个概念对您而言是新的，请参阅here和here以获得更好的解释 .

    你可以在那里看到，

    应用程序状态更改由三件事引起：1）事件 - 用户事件，如点击，更改，输入，提交，... 2）XMLHttpRequests - 例如 . 当从远程服务获取数据Timers - 3）setTimeout（），setInterval（）时，因为JavaScript ...事实证明，这是Angular实际上对更新视图感兴趣的唯一情况 .

    这就是滚动时视图没有被更新的原因，但是当你触摸页面的任何元素时它就会被更新（因为它是用户事件） .

    为了解决这个问题，其中一个选择是让Angular知道它需要知道你将要做的一些改变，因为事情可能需要更新 . 您可以通过在区域内运行一些代码（更新 x 属性的代码）来实现，如下所示：

    import { Component, NgZone } from '@angular/core';

@Component({...})
export class MyPage {

    constructor(..., private ngZone: NgZone) {}

    public yourMethod(): void {
        this.ngZone.run(() => {
            // Update the x property here, and the view will be updated!
        });
    }
}
    回复于

相关问题