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刪除工具提示樣式

回答

相關問題