ngRepeat删除工具提示样式

我有一个样式的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并保持我的自定义工具提示样式。

任何指导表示赞赏，谢谢！

来源

2015-10-05 Palindrome

可以请你创建小提琴链接 – Arun

你能提供你所有的代码吗？没有它就很难排除故障。 –

不幸的是，我无法分离和提取继承的风格，以便能够创建小提琴链接。我正在寻找ngRepeat的一般洞察力，希望它能确认/否定我对范围问题的假设。对不起，我无法提供完整的代码。 – Palindrome

解决方案是在中继器初始化并呈现后，“刷新”中继器中的动态元素。

创建新指令播放时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')); 
    });

增加 '上完成渲染= “ngRepeatFinished”' 到ngRepeat在ASCX：

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

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

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

如果有人想要更多的信息，我是如何处理这件事的，我把它贴在我的development blog上，你可以找到here。

来源

2015-10-08 02:44:01 Palindrome

ngRepeat删除工具提示样式

回答

相关问题