调整大小div上的angular2变化检测 [英] angular2 change detection on resize div

问题描述

我将引导程序用于布局，我需要检查是否自动更改了带有引导程序的DIV的自动计算尺寸，例如width = 25％.

I use bootstrap for my layout and I need to check if the automatic calculated size of my DIV with bootstrap for example width = 25% is changed.

是否可以对我未在模板中设置但由引导程序设置的属性进行更改检测. (window:resize)还不够.

Is there a possibility to do change detection on a attribute which I don't set in my template, but is set by bootstrap. (window:resize) is not enough.

thx

推荐答案

您可以向div添加指令，并实现生命周期挂钩ngDoCheck()来执行您自己的更改检测逻辑.您需要注入ElementRef:

You can add a directive to the div and implement lifecycle hook ngDoCheck() to perform your own change detection logic. You'll need to inject ElementRef:

constructor(private _elRef:ElementRef) {}
ngDoCheck() {
   // use ElementRef to examine the div property of interest

如果div在组件​​模板中，请添加本地模板变量

If the div is inside a component template, add a local template variable

<div #myDiv ...>

然后使用@ViewChild()获取对div的引用，并实现生命周期挂钩ngDoCheck()或ngAfterViewChecked()来执行您自己的更改检测逻辑.

Then use @ViewChild() to get a reference to the div and implement lifecycle hook ngDoCheck() or ngAfterViewChecked() to perform your own change detection logic.

@ViewChild('myDiv') theDiv:ElementRef;
ngAfterViewChecked() {
   // use this.theDiv to examine the div property of interest

请注意，每次运行更改检测时，都会调用ngDoCheck()和ngAfterViewChecked().另请参阅开发指南生命周期挂钩.

Note that ngDoCheck() and ngAfterViewChecked() will be called every time change detection runs. See also the dev guide Lifecycle Hooks.

这篇关于调整大小div上的angular2变化检测的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！