querySelectorВсе не работает с Angular, но работает в консоли - PullRequest
Новая
       91

querySelectorВсе не работает с Angular, но работает в консоли

0 голосов
/ 01 апреля 2020

У меня есть div, который содержит некоторые флажки, я хочу получить доступ к этим флажкам, используя querySelectorAll, но, похоже, он не работает внутри Angular, хотя он работает в консоли. 

@Component({
  selector: "formly-field-categories-helper",
  template: `
    <div [innerHTML]="categories"></div>
  `
})



ngOnInit() { 
 let inputs = '<input type="checkboxes" name="group" /> test`
 this.categories = this.sanitizer.bypassSecurityTrustHtml(inputs); 
}

ngAfterViewInit() {
  //alerts 0 
  alert(document.querySelectorAll('[name="groups"]').length);
}

, но когда Я открываю cosole и запускаю document.querySelectorAll('[name="groups"]').length, это дает мне 192 (не 0)

, полный код можно посмотреть здесь https://github.com/goblins-tech/almogtama3/blob/master/src/app/content/editor.ts#L248

note использование setTimeout решит проблему, но я не буду ее использовать. Я хочу запустить код только после полного создания DOM. 

setTimeout(() => {
      alert(document.querySelectorAll('[name="groups"]').length);
    }, 5000);

note ngAfterViewChecked запускается несколько раз, поэтому я избегаю его использования.

на следующем шаге я заменим document.querySelectorAll на nativeElement.querySelectorAll

1 Ответ

0 голосов
/ 01 апреля 2020

Добрый день!

Вы пробовали что-то подобное? 

ngAfterViewInit() {
  setTimeout(() => {
    alert(document.querySelectorAll('[name="groups"]').length);
  });
}
...