Question

提前感谢您的帮助。

我有一个样式的jquery工具提示，但是当它在ngRepeat中使用时，工具提示的自定义样式被删除了，我不知道为什么。

示例：

工具提示显示正确的样式：

<div class="toggle">
    <input type="checkbox" id="amount_{{i.ProductCode}}" name="amount" data-ng-model="$parent.amount" value="{{i.ProductCode}}" data-ng-required="1" /> 
    Hello&nbsp;<span class="info-tip" title="World!"></span>
</div>

工具提示显示默认样式：

<div data-ng-repeat="i in options.amounts" data-ng-cloak="">
    <div class="toggle">
        <input type="checkbox" id="amount_{{i.ProductCode}}" name="amount" data-ng-model="$parent.amount" value="{{i.ProductCode}}" data-ng-required="1" /> 
        Hello&nbsp;<span class="info-tip" title="World!"></span>
    </div>
</div>

我花了很长时间研究它，从我从研究中收集到的内容看起来似乎是一个ngRepeat范围问题。但是我不确定这是什么问题，我不确定如果它是如何修复它（因此来到这里）。理想情况下，我想使用ngRepeat并维护我的自定义工具提示样式。

感谢任何指导，谢谢！

Answer 1

解决方案是在初始化和渲染转发器后“刷新”转发器中的动态元素。

在ngRepeat完成渲染时创建要广播的新指令：

app.directive('onFinishRender', ["$timeout",function ($timeout) {
    return {
        restrict: 'A',
        link: function(scope, element, attr) {
            if (scope.$last === true) {
                $timeout(function() {
                    scope.$emit('ngRepeatFinished');
                });
            }
        }
    };
}]);

在控制器中为广播创建一个监听器，然后更新工具提示的父级（进而更新工具提示）：

$scope.$on('ngRepeatFinished', function (e) {
        window.hbf.angular.components.byName("components/Tooltip")
            .update($('.parentClass'));
    });

将'on-finish-render =“ngRepeatFinished”'添加到ascx中的ngRepeat：

<div data-ng-repeat="i in items" data-ng-cloak="" on-finish-render="ngRepeatFinished">

推理：在页面加载事件中，jQuery将自定义工具提示类绑定到工具提示功能。但是，当它在转发器中使用时，事件在页面加载后触发，并且没有现有绑定。因此，有必要再次将新创建的元素绑定到工具提示以“刷新”它们并让它们显示。

基本上jQuery已初始化并呈现，但ngRepeat在客户端。每个重复都是使用子级的范围动态生成的，而不是父级的，因此所有原始绑定都超出范围，需要在创建ngRepeat后重新绑定。

如果有人想了解我如何处理此问题的更多信息，请将其发布在development blog here上，https://github.com/aigamedev/scikit-neuralnetwork/issues/117。

ngRepeat删除工具提示样式

1 个答案: