Question

问题描述： 两个div的宽度改变了。 Div＃1 变大， Div＃2 变小。 Div＃2 是angular-slider的容器。容器正在更新，但滑块保持旧尺寸 UNTIL 您更改滑块的一个气泡

see this Plunker

为什么只有在与滑块交互时才会发生这种想法？

----的更新 -----

我编写了一个示例，其中包含一个名为width-watcher 的指令。它正在观看 Div＃2 的宽度，只是在做一个console.log。同样的问题在这里只有在更改滑块的一个气泡时，才会记录消息。

如何听取尺寸变化？为什么滑块更新时才会发生这种情况？

见这里：

Updated Plunker

Answer 1

此问题的解决方案是等待动画结束。

即使用 CSS事件transitionend 。所以注册这个：

post: function(scope, element, attributes) {
angular.element(document.getElementsByClassName('rightPanel')).on('transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd', 
          function() {
           console.log('animation ended');
           updateDOM();
          });

动画结束后，

会以正确的方式更新DOM 。因此， width-watcher 指令从未使用过并且已被删除。

更新了Plunker： http://plnkr.co/edit/OVZgxEgZKZg3tZ9nGn76?p=preview

角度滑块未在尺寸更改时更新

1 个答案: