中止拖放后Angular-Elements不刷新答案

【问题标题】：Angular-Elements are not refreshing after aborted drag&drop中止拖放后Angular-Elements不刷新
【发布时间】：2017-06-09 01:54:14
【问题描述】：

我有以下 angular-List（减少了内容以使其更具可读性）：

 <div ng-repeat="element in bigBlock.Elements track by $index"
                         class="singleBlockElement"

                         ng-drop="dragSource=='Block'"
                         ng-drop-success="To($index, $data, bigBlock)">
                        <div class="bbRange">&nbsp;</div>
                        <i class="fa {{GetImage(element)}}" />
                        <div ng-drag="element.ElementType!=='placeholder'"
                             ng-drag-data="element"
                             ng-drag-start="Start()"
                             ng-drag-success="From(element,bigBlock, $index, bigBlock.$index)"
                             ng-drag-stop="Stop(element, bigBlock, $index, bigBlock.$index)"
                             class="cutOff">
                            {{element.Title}}
                        </div>
                        <div class="edit ng-show="GetLinkText(element, true)">
                            <span class="isvisible">
                                <i title="{{element.Present?'Präsentieren':'Nicht präsentieren'}}" class="fa fa-{{element.Present?'eye':'eye-slash'}}"></i>
                            </span>
                            <a href="#" ng-click="Edits.Element(element, true)">{{GetLinkText(element,true)}}</a>
                        </div>
                    </div>

它是这样的：这是在拖动时：这就是当我根本不像下面描述的那样下降时的样子：

我现在可以（成功地）将两个元素（“Welcome”和“Go Away”）拖放到该块中，从而改变这两个元素的顺序。

但是如果我中止拖放。例如拖动“欢迎”而不是将其向下移动或将其移动到我无法放下的区域（在块外），“欢迎”文本会消失。

没有错误。下降只是没有发生（如预期的那样），但 Angular 似乎无法重新显示该元素的文本。 ({{element.Title}})

我尝试使用 $apply() 强制刷新，但这并没有改变任何事情（也没有产生错误）。

但是，如果我在页面上执行任何操作（例如单击编辑按钮或其他任何导致事件的操作），日期会再次正确显示。

所以这对我来说似乎是一个刷新问题。

我为此使用 ngDraggable (https://github.com/fatlinesofcode/ngDraggable)

（更新：在 Chrome 的开发者控制台中分析页面源，文本似乎仍然存在，甚至“应该”可见（显示：块），所以这可能更多是浏览器问题（chrome）而不是角度问题）

【问题讨论】：

标签： angularjs drag-and-drop ngdraggable

【解决方案1】：

这似乎是纯粹的浏览器/CSS 问题，而不是 Angular 问题。我通过强制浏览器刷新父容器来解决这个问题：

$('.mm-Right')[0].style.display = 'none';
$('.mm-Right')[0].offsetHeight; 
$('.mm-Right')[0].style.display = 'block';

我的结构在哪里

<div class='mm-Right'>
<div class='singleBlockElement>[..]</div>
<div class='singleBlockElement>[..]</div>
<div class='singleBlockElement>[..]</div>
</div>

这确实解决了问题，但对我来说似乎是在作弊。我宁愿这个错误甚至不出现，而不是隐藏症状。因此，我很乐意接受针对该问题的任何更好的答案。

【讨论】：