Angular Ionic 2 ionScroll事件不刷新视图

我在

中添加了一个触发方法

foo（）

的ionScroll事件，并在

中添加了一个触发

foo（）

的click事件。在我的模板中，我添加了一个示例

{{x}

，并且

foo（）

方法递增

x

单击按钮刷新视图，以便显示新值。滚动条没有移动。如果我添加一个

console.log

，这将打印出来

如果我将fokus设置为文本框之类的元素，视图将刷新，并显示新的

x

值

---

有人知道为什么吗？

那是因为有一种非常有趣和强大的东西叫做区域。如果这个概念对您来说是新的，请参阅和以获得一个很好的解释

正如你在那里看到的

应用程序状态更改由三个因素引起：

1） 事件-用户事件，如单击、更改、输入、提交等

2） XMLHttpRequests—例如，从远程服务获取数据时 计时器-

3） setTimeout（），setInterval（），因为JavaScript

…事实证明，只有在这种情况下，角度 对更新视图感兴趣

这就是为什么当您滚动时视图不会更新，但当您触摸页面的任何元素时视图会更新（因为这是一个用户事件）

为了解决这个问题，其中一个选项是让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!
        });
    }
}

---

这是因为有一种非常有趣和强大的东西叫做区域。如果这个概念对您来说是新的，请参阅和以获得一个很好的解释

正如你在那里看到的

应用程序状态更改由三个因素引起：

1） 事件-用户事件，如单击、更改、输入、提交等

2） XMLHttpRequests—例如，从远程服务获取数据时 计时器-

3） setTimeout（），setInterval（），因为JavaScript

…事实证明，只有在这种情况下，角度 对更新视图感兴趣

这就是为什么当您滚动时视图不会更新，但当您触摸页面的任何元素时视图会更新（因为这是一个用户事件）

为了解决这个问题，其中一个选项是让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!
        });
    }
}

---

谢谢你的回答，这些区域真的帮助了我。如果我没弄错的话，它只是一个功能列表的胶囊。和区域确保在离开区域之前调用所有函数？但是为什么不使用承诺和堆栈函数呢<代码>承诺。然后（..）。然后（..）。我认为scrollin是一个事件…关键是区域不仅用于确保某些方法的执行顺序，区域是一个包装器，允许angular说ok，在幕后做所有需要做的事情，并在需要检查更改和更新视图时通知我。这是一个非常强大的概念，因为它还可以用来提高应用程序的性能，通过在一个区域之外做一些事情（从而使它们对角度不可见），正如你所读到的，谢谢你的回答，区域真的帮助了我。如果我没弄错的话，它只是一个功能列表的胶囊。和区域确保在离开区域之前调用所有函数？但是为什么不使用承诺和堆栈函数呢<代码>承诺。然后（..）。然后（..）。我认为scrollin是一个事件…关键是区域不仅用于确保某些方法的执行顺序，区域是一个包装器，允许angular说ok，在幕后做所有需要做的事情，并在需要检查更改和更新视图时通知我。这是一个非常强大的概念，因为它也可以用来提高应用程序的性能，通过在你可以阅读的区域之外做一些事情（从而使它们对Angular不可见）