问题标签 [angular-changedetection]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
2043 浏览

angular - 分离组件的角度手动更改检测

使用 Angular Dart 5.2,我正在尝试探索如何将组件从变更检测中分离出来并进行手动检查,但未能成功。这是一个最小的例子:

app_component.dart

分离的.dart

我的期望是分离组件的视图将每 3 秒更新一次,并使用新internal值。控制台日志反映internalList 每秒都会用新值创建新的值,我detectChanges()每 3 秒运行一次,但屏幕上没有任何变化。

我也尝试过的事情:

  • 手动将组件从构造函数的更改检测中分离 - 没有任何变化
  • 使用OnPush策略而markforCheck()不是detectChanges()- 按预期工作

所以问题是:如何将组件从变更检测中分离出来并在某些事件上手动触发它?

0 投票
2 回答
98 浏览

angular - Angular .nozone 文件上传器组件

我正在使用 Angular 7 尝试创建拖放文件上传组件。我让它在下面工作。

我的问题是这方面的性能很糟糕(drop 和 saveFiles() 运行之间的延迟时间约为 4 秒),因为每次触发的事件dragover都在运行更改检测。dragleave经过大量研究后,我发现最好的解决方案应该是dragover从 ngzone 中删除事件,这将阻止更改检测触发。从这里开始:https ://github.com/angular/angular/pull/21681 这样做的一个非常简单的方法似乎是(dragover.nozone)="stopAndPrevent($event)". 这确实解决了性能问题,但它也不再起作用,因为浏览器恢复为使用其默认行为(在浏览器中加载文件)忽略event.preventDefault();. 有谁知道更好的方法或知道如何解决我在这里遇到的性能问题?

0 投票
1 回答
871 浏览

angular - 子元素初始化后,父组件对子 DOM 的操作导致 ExpressionChangedAfterItHasBeenCheckedError

我想在子组件初始化后从父组件对子组件进行一些操作。

家长:

孩子:

链接到StackBlitz进行复制

编辑:

如果我添加setTimeout到父组件,它可以工作。我可以在没有的情况下实现它setTimeout吗?

0 投票
1 回答
6548 浏览

angular - Angular7 - [ngModel] 不会在组件中更新,当两次输入相同的值时

最小的 Stackblitz 示例

https://stackblitz.com/edit/angular-mqqvz1

在 Angular 7 应用程序中,我创建了一个带有<input>字段的简单组件。

当我用键盘更改输入值时,我希望将值格式化为onBlur。- 在最小的例子中,我只想向它添加字符串“EDIT”

这基本上是有效的:

  • 如果我输入“test”并模糊该字段,它将更改为“test EDIT”
  • 如果我输入“lala”并模糊该字段,它将更改为“lala EDIT”

但是 ,当我输入“测试”-模糊(它有效)并再次输入“测试”时,它不再有效!

-functiononInputUpdate()被调用(你可以在控制台日志中看到它),变量inputValue被更新(你可以在组件中看到它{{inputValue}}),但是输入值没有改变! 我希望它是“测试编辑”,但它仍然是“测试”。

当我输入另一个字符串时它可以工作,但是连续输入相同的字符串 2 次不起作用。这是为什么?我怎样才能解决这个问题?

组件.html

组件.ts

0 投票
0 回答
93 浏览

angular - ChangeDetectorRef 破坏状态

我们有一个组件元素到另一个组件的 Jumpto 操作。在这种情况下,ChangeDetectorRef[destroyed]总是正确的,因为它我无法强制ChangeDetectorRef.detectChanges()运行

home.component

仪表板.组件

它是否携带home.component被破坏的实例dashboard.component?如何克服这个?

0 投票
1 回答
361 浏览

angular - 在 prodMode 中更改检测角度

嗨,我收到这个错误“表达式在检查后已更改”,但我的应用程序的行为是正确的。第一个问题是如果发生错误,为什么组件可以正常工作?

例如,我有 2 个兄弟组件,它们像这样使用它们:

当 cmp-a 中的 onSelectItem 发出时,我得到错误。但 selectedItem 正确传递给 cmp-b 并且一切都很好,还可以!

第二个问题是如果真的发生错误,为什么在 prod 模式下不通过角度框架显示此错误?

谢谢

0 投票
0 回答
179 浏览

angular - Angular - 承诺在下一个变更检测周期解决

我正在调用一个返回 Promise.all 的函数。

只有当我打开浏览器控制台或关闭它时,才会触发成功回调。`

0 投票
0 回答
614 浏览

angular - 更改检测;application.tick 被递归调用?为什么

我有一个父组件 A 和子组件 b 和服务 c 用于加载加载弹出服务的成功和失败。

在 B 子组件中有一个称为 newchanges 的按钮,b 组件发出值并在组件中调用函数,并且在服务调用中有一个服务调用。

在不断单击子组件 b newchanges 按钮时,我正在递归调用 error.application.tick 。

如果我不使用 application.tick ,则加载对话框未关闭,因此我已在服务中的应用程序引用中使用。它是所有模块的全球服务。

任何人都可以帮助解决:

这是服务调用成功和关闭加载器失败时使用的加载器服务。

我需要关闭加载程序,该加载程序是在另一个服务成功和失败中使用的服务,当我不使用应用程序引用时,它没有关闭,所以我在此之后使用了这个,我点击不断调用服务得到一个提到的错误。

我尝试了另一个使用 zone 的选项,加载程序未关闭:

0 投票
0 回答
37 浏览

android - ChangeDetectector 调用 onLoad

所以我有一个自定义组件,其中包含一些需要调用 changeDectector.detectChanges() 的动画

来自我的 childComponent.ts:

这一直有效,直到我向我的父组件添加了一个 ngif,如下所示:

出于某种原因,当我添加 ngif 时,它导致 childComponent 多次调用 onLoad。因此,每次我调用 this.changeDetector.detectChanges() 时,都会触发 onLoad 方法,从而导致“超出最大调用堆栈大小”。有谁知道这里发生了什么?我该如何解决?

提前谢谢各位!

0 投票
1 回答
247 浏览

angular - Angular 的变更检测机制让我失望

到目前为止,我已经为一个非常奇怪的问题而战了一个多小时:

...以及上述视图背后的代码:

用例 #1,有效的一个:用户未登录;然后他或她通过 google-auth 程序(使用 Firebase 提供的弹出机制)和ng-if get 按预期立即更新

用例#2,无效的:在用户登录并刷新页面后——即使console.log报告isSignedIn变成true预期的那样——除非点击按钮,否则不会发生视觉变化;只有在该按钮被重新呈现为正确的ng-if选项之后。

我远非 Angular 大师,对变更检测机制知之甚少。求救。