简体繁体 English

检测元件角度调整大小

[英]Detecting element resize in angular

原文 2014-10-13 06:18:34 5 1 javascript/ jquery/ angularjs

I'm using the UI-Calendar directive for Full Calendar and I have some resizing issues. 我将UI-Calendar指令用于“完整日历”，并且遇到一些调整大小的问题。 The div that the calendar is in can change size based on an event which changes the div's class and thereby it's size. 日历所在的div可以根据事件来更改大小，该事件会更改div的类，从而更改其大小。 When this happens, the calendar redraws incorrectly. 发生这种情况时，日历会错误地重绘。 I can detect when the trigger occurs, but this seems to be inside the digest loop, ie before the element has actually changed sizes, so telling fullcalendar to redraw at this point is not helping. 我可以检测到触发发生的时间，但这似乎是在摘要循环内，即在元素实际更改大小之前，因此在此时告诉fullcalendar重绘无济于事。

Neither does jQuery.resize seem to fire (either by using angular's jqlite or the real jQuery). jQuery.resize似乎都没有触发（通过使用angular的jqlite或真正的jQuery）。 BTW, window resize does fire. 顺便说一句，窗口调整大小会触发。

Currently, I'm solving it with aa $timeout every 100ms to check if the size has changed, which is a rather gross hack. 目前，我正在每100毫秒使用$超时来解决它，以检查大小是否已更改，这是相当不明智的做法。

How can i either get notified when a div has resized or hook into the end of the digest loop, so that I see the size change reflected? 当div调整大小时如何通知我或挂接到摘要循环的末尾，以便看到大小变化？

1 个解决方案

The resize event only fires when it's bound to the window (except for IE, where you can bind it to any HTML element). 调整大小事件仅在绑定到窗口时触发（IE除外，您可以在其中将其绑定到任何HTML元素）。 Here , more about that. 在这里，更多有关。

Checkout http://marcj.github.io/css-element-queries/ for an efficient solution. 检出http://marcj.github.io/css-element-queries/以获取有效的解决方案。