Wie weithin bekannt ist, benutzt Angular für DOM-Angelegenheiten intern eine abgespeckte jQuery-Variante namens jqLite, auf die über angular.element zugegriffen werden kann. Diese bietet ein paar Methoden aus dem Bereich DOM-Manipulation und -Traversing, hat jedoch keine Selektor-Engine. Bindet man parallel zu Angular die jQuery-Library ein, wird jqLite durch jQuery ersetzt.
Angesichts der Tatsache, dass Angular eigene Services für AJAX und Animationen (Version >= 1.1.3 in Verbindung mit CSS3) bietet, ist der Einsatz von jQuery jedoch stark übertrieben. Zum Glück gibt es die von jQuery verwandte und von John Resig geschriebene Selektor-Engine Sizzle auch als Stand-alone-Version. Diese kann man alternativ einbinden. Man muss angular.element dann nur noch beibringen, sie auch zu verwenden.
Das wiederum ist schnell erledigt.
// Anlegen einer Referenz auf die eigentliche angular.element-Methode
angular._element = angular.element;
// Ueberschreiben der angular.element-Methode
angular.element = function (selector) {
// ist das uebergebene Argument bereits eine
// Instanz von angular._element, wird es ohne
// Umschweife zurueck gegeben.
if (selector instanceof angular._element) {
return selector;
}
// Andernfalls wird eine Sizzle-Instanz erstellt
// und an die angular._element-Methode uebergeben.
return angular._element(Sizzle(selector));
};Fertig ist die Laube!
Das ganze gibt es auch als Angular-Modul Angular-Sizzle" auf Github.
Zum Schluss noch der Hinweis, dass der Einsatz von Angular-Sizzle gut überlegt sein will. Das Konzept von Angular sieht vor, dass tiefgreifendere Arbeiten am DOM über Direktiven erledigt werden. Diese bieten abstrahierte Element-, Klassen- und Attribut-Selektoren. Innerhalb der Direktiven gibt es automatisch eine jqLite-Instanz der relevanten DOM-Elemente, mit der man arbeiten kann.
Der Einsatz einer ausgewachsenen Selektor-Engine könnte also übertrieben sein. Das hängt jedoch davon ab, was man vor hat.