Angular2 récupérer tous les éléments avec un nom de classe

N'importe qui peut aider avec la façon de trouver les "Toutes les" Éléments avec un nom de classe dans Angulaire 2? J'ai pensé qu'il serait trivial, mais c'est ce qui me donne plus de problèmes qui a été préparé pour.

<span class="classImLookingFor">foo</span>
<span class="classImLookingFor">Voo</span>
<span class="classImLookingFor">Moo</span>

J'ai pensé à faire ce que j'ai ci-dessous, vous obtiendrez tous les éléments avec la classe "classImLookingFor" mais il retourne uniquement la première instance.

constructor(private renderer: Renderer){}
ngAfterViewInit(){
 const el = this.renderer.selectRootElement('.classImLookingFor');
 this.renderer.setElementAttribute(el, 'tabindex', 0);
}

Par la suite, mon balisage ressemble à ceci.

<span class="classImLookingFor" tabindex="0">foo</span>
<span class="classImLookingFor">Voo</span>
<span class="classImLookingFor">Moo</span>

Il semble que je devrais être en mesure de créer un moteur de Rendu de tableau, mais cela ne semble pas fonctionner non plus. J'ai besoin de manipuler chaque élément avec un nom de classe. Merci d'Avance

vous pouvez utiliser document.querySelectorAll('.classImLookingFor')
Juste ce que je cherchais. Qui fonctionne parfaitement. Pour une raison que si, document.getElementsByClassName n'a pas fonctionné pour moi. Merci pour la réponse rapide. Je le faisait trop compliqué
pouvez-vous upvote ma réponse que cela vous a aidé
consultez le la solution idéale, que j'ai fourni. document.querySelectorAll n'est pas conseillé car il va rechercher dans l'ensemble des DOM

OriginalL'auteur dekaha1 | 2017-04-12

  1. 15

    N'est-ce pas le retour de tous les éléments dans le DOM? Est-il un moyen pour renvoyer uniquement les éléments générés par la composante Angulaire que je suis "dans"?

    Vous avez besoin pour...

    1. Injecter ElementRef dans le constructor

      constructor(private renderer: Renderer, private elem: ElementRef){}

    2. Trouver les éléments que vous êtes à la recherche à l'aide de querySelectorAll api.

      ngAfterViewInit(){
    //you'll get your through 'elements' below code
    let elements = this.elem.nativeElement.querySelectorAll('.classImLookingFor');
}

    La réponse @Aravind a fourni n'est pas le meilleur pour les performances qu'il va chercher l'ensemble des DOM.

    Cette solution sera simplement chercher les DOM à l'intérieur du composant.

    OriginalL'auteur Paritosh

  2. 4

    Répondre que le commentaire a travaillé pour l'OP.

    Vous devriez être en utilisant 

    document.querySelectorAll('.classImLookingFor')
    N'est-ce pas le retour de tous les éléments dans le DOM? Est-il un moyen pour renvoyer uniquement les éléments générés par la composante Angulaire que je suis "dans"?
    u as raison, vérifier cette réponse
    osez commentaire @ downvoter

    OriginalL'auteur Aravind

  3. 3

    Cela pourrait être un peu simpliste, pour votre cas d'utilisation, mais est-il une raison pour laquelle vous ne pouvez pas utiliser la native des fonctions DOM, comme?

    var domRepresentation = document.getElementsByClassName('classImLookingFor');
var angularElement = angular.element(domRepresentation);
    version modifiée du commentaire
    Regardé à droite après le commentaire de la première fois que je lis cela, désolé.
    Je suis très nouveau à Débordement de Pile et vu, il y avait 0 réponses. Est-il la meilleure pratique pour commenter en premier au lieu de répondre à la question d'emblée @Aravind ?

    OriginalL'auteur Billy Barry

  4. 0

    vous avez besoin d'utiliser DOM angulaire 

    var element=document.getElementsByClassName("X").item(0);

    ça marche pour moi!

    OriginalL'auteur mohsen malvandy niko