javascript - angular2'de birden fazla dom öğesi seçmek

Bileşen şablonunda bir ul içindeki birden fazla li öğesini almaya çalışıyorum. Tek bir öğe için ElementRef.nativeElement.querySelector('selector') kullanabiliyorum ama belirli bir sınıfa sahip birden fazla öğeyi hedeflemek istediğimde sorun yaşıyorum.

benim şablonum:

  <ul class="js-side-nav-content side-nav__content">
    <li routerLink="/home">Home</li>
    <li routerLink="/create">Create</li>
    <li routerLink="/office">Office</li>
  </ul>

Bileşen kodu:

sideNavContentEl: HTMLElement;
constructor(private el: ElementRef) {}
this.sideNavContentEl = this.el.nativeElement.querySelector('.js-side-nav-content');

Burada <ul> öğesini seçiyorum ama <li> öğelerini almak istiyorum.

querySelectorAll'i denedim ama uygun bir çözüm bulamadım. Bunu ElementRef kullanarak yapmak mümkün mü yoksa farklı bir yaklaşım mı izlemem gerekiyor?

Cevap #1

querySelectorAll gibi aşağıdaki şekilde çalışmalıdır,

this.el.nativeElement.querySelectorAll('.js-side-nav-content > li');