问题标签 [angular-lifecycle-hooks]

我编写了一个服务并将其注入到我的对话框中。我希望在关闭对话框时调用服务的 ngOnDestroy() 函数。但事实并非如此。

所以我想知道什么时候 ngOnDestroy() 会被解雇？
如果我希望它们在对话框关闭时被终止，我将如何取消订阅服务中的订阅？

这是 stackblitz 示例：https ://stackblitz.com/edit/angular-bf1taz

我在父级上有 onInit，它对将成为子组件输入的数据进行按摩。并且输入用于孩子的 onInit 以传递给服务。当我在孩子的 onInit 上设置断点时它工作正常，输入已经被按摩并且我想要什么。但这是否意味着它首先完成所有父母的生命周期，然后是孩子的生命周期？如果我放置断点，它就像.. parent onInit -> child onChanges -> child onInit。这是我想要的顺序，但我只是想确保始终如此，否则我可能需要将数据按摩逻辑移动到父级的构造函数。

I want to delay ngOndestroy hook calling since I am facing one issue which is i have created angular application, in that I have used animation.

sample - https://stackblitz.com/edit/angular-iribr7-zorjpc?file=app.component.html

When I press toggl button, my components get displayed with animation. When I press that button 2nd time, my component get destroyed before animation.

In my components ngOndestroy hooka I have used below:

I have tried settimeout method also, while using setTimout it works fine while debugging but with out that same issue again

I am expecting any other work around or suggestion to resolve this.....

I tried like below but no luck for me----------

https://stackblitz.com/edit/angular-iribr7-bxvnwg?file=app.component.html

背景：单击按钮后，我的主页会打开项目中另一个模块的外部窗口（同源）。我还设置了一个 BroadcastChannel 以便这两个窗口现在可以通信。现在，如果此窗口已经打开并且用户再次单击触发按钮，我想将其传达给窗口：

新窗口侦听此通道并将消息数据附加到 ngFor 中使用的数组中。为了更加安全。每次推送新值以导致重新绑定时，我都会继续创建一个全新的数组。这是在新窗口中为组件供电的逻辑。

这是模板 HTML：

我还包括一个按钮，该按钮触发一个与 postMessage 处理程序具有完全相同逻辑的函数（“func()”）。

现在，当我单击此窗口中的按钮时，我将得到预期的行为：正确数量的“NEW FIELD BOX”div 将出现在这个新窗口中。但是，当我从主屏幕按下通过 BroadcastChannel 发布消息的原始按钮时，它不会更新 UI 以显示正确数量的“NEW FIELD BOX”div。使用断点我可以看到数组 newFields 确实包含正确数量的值，但 ngFor 不会重新渲染。

示例：我单击主页上触发 onAddNewFieldClick() 的按钮。它会打开一个新窗口，其中有一个“NEW FIELD BOX”div。我再次单击此按钮，该按钮会发布一条消息以添加另一个消息。尽管如此，窗户上只剩下一个。我现在单击窗口中触发函数“func()”的按钮。现在这将呈现 3 个“NEW FIELD BOX”div（来自初始化的原始一个，来自未呈现的发布消息的一个，以及来自单击此按钮的一个）。

为什么更改检测似乎没有从 postMessage 发生的任何想法？

考虑以下 html：

如果我使用app-footer钩子ngAfterViewInit()将脚本附加到包含jQuery处理组件中元素的html app-header，会起作用吗？

与钩子相比，app-header钩子何时执行？ 会先执行吗？异步？ngAfterViewInit()app-footer

我在网页中有一个锚标记，其 href 值取决于属性不受此组件控制的服务。服务详细信息是异步填充的。

为了获取服务详细信息并创建 href 值，我想到了两种方法。 我的问题是 - 在性能方面哪个更好？什么应该是更好的选择？

使用函数作为 href 属性

这会导致函数被连续调用。

使用 ngDoCheck

感谢您阅读到这里。任何指导表示赞赏

我正在开发一个 Angular 应用程序并尝试分析这个应用程序的性能。为此，我使用 Elasticsearch 的 Kibana 和 APM 服务器。APM 服务器已经能够通过主要获取各种 HTTP 请求的时间来测量初始页面加载和路由更改的时间。到目前为止，一切都很好。

但现在我想微调这个测量，因为不是每个 HTTP 请求都发生在路由更改期间。情况是，一个站点上有多个组件，其中很多组件包括 PrimeNG 表 ( <p-table>)，它们会在不更改路径的情况下更新，例如，当用户在搜索输入中输入内容时。

所以这是我通过创建一个@TimeTracking()扩展 Angular 生命周期钩子ngOnInit()和ngOnDestroy(). 为了获得有关组件寿命的更多信息，我还测量了 和 之间的ngDoCheck()性能ngOnViewChecked()。

我从How to test rendering speed in Angular和https://netbasal.com/inspiration-for-custom-decorators-in-angular-95aeb87f072c中获得了这种方法的想法。

此外，我还使用 HTTP 拦截器测量每个 HTTP 请求的时间：

长话短说，以下是我的问题：您如何看待这种方法？您有任何进一步的想法或改进建议吗？是否有可能获取有关哪个事件触发了ngDoCheck()获取更多信息的信息？是否可以将测量的 HTTP 请求（在拦截器中）与触发它的组件相匹配？

我已经在 Angular 应用程序中实现了 FullCalendar，并在完整日历中绑定了一些事件。我需要在按钮单击时使用新数据更新日历事件并显示 Day1、Day2、Day3... 代替 Mon、Tues、Wed... 所以我已成功设置 Day1、Day2... 代替 Mon，星期二...关于ngAfterViewInit()角度事件。但是日历日期点击事件在那之后不起作用，它也没有用新数据更新日历事件

全日历html代码：

全日历 ts 代码：

可能是什么问题？

我正在尝试从 ckEditor 获取更改后的值，即文本并将结果输出发送给父级。

下面是对应的代码：

editor.component.html：

编辑器.component.ts

父组件.html

父组件.ts

我也尝试过ngAfterContentChecked但以同样的错误告终。

我有一个接受输入的子组件

在子组件中，我通过执行以下操作检测对 customModel 输入的更改：

在我的父组件中，我想在父组件被销毁时通知子组件

当父组件的 ngOnDestroy 中输入 customModel 发生变化时，子组件的 ngOnChanges 不会被调用。为什么会发生这种情况？

我在孩子中有一个音频元素，即使在父母被破坏后仍然可以听到音频。

ngOnChanges 在我更改输入时在其他情况下被调用，但不是通过 ngOnDestroy