Вместо $ .closest в Angularjs

Question

Я хочу реализовать этот код в директиве, но в jQLite это не работает. Как это сделать?

var thisCell = element.closest('.sampleclass'); 

Answer 1

Вы должны реализовать эту функцию вручную, например:

var thisCell = (function closest(e, className) { 
    if (e[0].nodeName == "HTML") { 
    return null; 
    } else if (e.hasClass(className)) { 
    return e; 
    } else { 
    return closest(e.parent(), className); 
    } 
})(element, "sampleclass"); 

Answer 2

В documentation говорится, что:

Для поисков по имени тега, попробуйте вместо angular.element (документ) .find (...) или $ document.find(), или использовать стандартные API DOM , например document.querySelectorAll().

Answer 3

Там есть экспериментальная версия .closest в Firefox и Chrome, как показано на MDN - Element.closest()

С этим в виду, вы могли бы написать что-то например

var elm = document.querySelector('.myClass').closest(); 

или с angular.element

var elm = angular.element(document.querySelector('.myClass').closest()); 

Конечно всегда есть исключение из правила (ака IE) и для них можно использовать Polyfill, которая также показана на MDN - Element.closest()

if (window.Element && !Element.prototype.closest) { 
    Element.prototype.closest = 
    function(s) { 
     var matches = (this.document || this.ownerDocument).querySelectorAll(s), 
      i, 
      el = this; 
     do { 
      i = matches.length; 
      while (--i >= 0 && matches.item(i) !== el) {}; 
     } while ((i < 0) && (el = el.parentElement)); 
     return el; 
    }; 
} 

Я использовал это успешно, чтобы получить наиболее близкий вид от имени элемента, выполнив эту строку кода (он работает в IE с Polyfill:

var form document.querySelector('[name="elmName"]').closest("form");