Использование метода jQuery Remove() для элементов, связанных с привязкой угловых данных

У меня есть следующий код JS/jQuery:

window.isTouchDevice = 'ontouchstart' in document.documentElement;

$(document).ready(function(){
 if(window.isTouchDevice === false){
 $('.overlay').removeClass('touch-placeholder');
 $('.button-planes').remove();
 $('.button-cars').remove();
 }
});

Первая строка в функции обратного вызова для удаления класса "touch-placeholder" работает. Следующие два вызова метода jquery 'remove' не выполняются. Если я запустил любую из этих двух строк в консоли браузера после загрузки страницы, элементы будут правильно удалены из DOM.

HTML, который я запускаю JS, выглядит следующим образом:

<div ng-repeat="item in itemsContainer">
 
 <a href="#" ng-click="someFunction($index)" target="_blank">
 </a></div>

HTML привязан к массиву Angular 'itemsContainer' и отображает DIV на основе длины массива. Я помещал брандмауэр между методами jQuery 'remove' и заметил, что HTML для результатов еще не был отображен, хотя я использую $(document).ready.

Каков наилучший способ удаления элементов привязки в этом случае, когда элементы, которые я хочу удалить, отображаются с помощью функции привязки угловых данных?

2 ответа

Я решил проблему, создав настраиваемую директиву:

myModelApp.directive('onFinishRender', function($timeout){
 return function(scope, element, attrs){
 var isTouchDevice = 'ontouchstart' in document.documentElement;
 //After last item is rendered, do the enclosed things
 if(scope.$last && isTouchDevice === true){
 $('.overlay').removeClass('touch-placeholder');
 $('.button-planes').remove();
 $('.button-cars').remove();
 //Other things you want to do 
 }
 }
 }
});

Добавьте директиву в HTML:

<!--Notice the camal-cased JavaScript name being transformed into one 
with dashes-->

<div ng-repeat="item in itemsContainer" on-finish-render=""><code></code> </div>


если вы действительно хотите удалить элемент DOM, вы захотите использовать ngIf

Я бы поставил переменную типа isTouchEnabled на $ rootScope, а затем использовал ng-if = "! IsTouchEnabled" на элементах, которые вы хотите удалить.

licensed under cc by-sa 3.0 with attribution.