Angular 4 和 settimeout答案

【问题标题】：Angular 4 and settimeoutAngular 4 和 settimeout
【发布时间】：2018-01-19 06:51:40
【问题描述】：

在 Angular 中，我希望通过 2 路绑定在 DOM 上更新更改后执行的一些函数。

AS 事件不清楚，使用了很多 settimeout 函数，这些函数导致 CPU 使用率很高。

请务必让我们知道 Angular 完成 DOM 中的更改后触发的事件。

【问题讨论】：

您可以使用 ngAfterViewInit 或 ngAfterViewChecked 取决于您的要求
What is the Angular equivalent to an AngularJS $watch?的可能重复

标签： angular settimeout

【解决方案1】：

有许多这样的 Angular 生成事件，称为 Angular 生命周期钩子。

你可以阅读这篇文章https://angular.io/guide/lifecycle-hooks

所以基本上你可以使用以下任何一种：

ngAfterContentInit()

ngAfterContentChecked()

还有其他的。本文将帮助您确定使用哪一个。

【讨论】：

您好，我知道这些事件，但是当服务订阅导致模型中的更改并且模型与 UI 绑定并且反映 UI 上的更改（需要为 100 % 确保 chnages 反映到 UI）然后我想处理事件（目前我们正在使用 settimeout）

【解决方案2】：

正如@Sandip Patel 在 cmets 中提到的那样。您可以使用ngAfterViewInit() 方法。这是一个组件的示例。

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

@Component({
  selector: 'app-my-component',
  templateUrl: './my.component.html',
  styleUrls: ['./my.component.scss']
})
export class MyComponent implements OnInit, AfterViewInit {

  constructor() { }

  ngOnInit() {
  }
  ngAfterViewInit(){
  // DOM is loaded. do your logic or DOM-manipulation here.
  }


}

【讨论】：

嗨，我知道这些事件，这里 Init 在组件初始化时第一次被调用，因为我想在组件更新时跟踪事件（模型）被更新为订阅的服务和事件，我想在模型完全反映在 UI 上之后处理 UI。
也许你正在寻找这样的东西：stackoverflow.com/a/34570122/1471485
谢谢约翰，这个链接真的很好，但我的问题仍然没有答案。在链接的给定流程中，“对于发现的任何绑定更改，更新组件，然后更新 DOM。更改检测现在完成。浏览器注意到 DOM更改和更新屏幕。”