Можно ли работать с DOM напрямую используя при этом Angular?

Question

[iluxa1810]

Можно ли работать с DOM напрямую используя при этом Angular?

Допустим, хочу нажать на кнопку и после этого что-нибудь добавить в DOM собственноручно.

Как я это могу сделать в компоненте?

Если да, то приведите очень простой пример.

Answer 1

[Дмитрий Лузанов]

Можно, но не нужно. Аукнется, если будете потом SSR или WebWorker прикручивать. Вместо этого используйте Renderer2

Answer 2

[msdosx86]

В этом нет необходимости. Если вы хотите по клику кнопки добавлять например элемент в массив, то просто добавляйте его. Ангуляр всё за вас сделает. В этом вся суть фреймворков. Они позволяют вам думать о бизнес-логике, а не о деталях реализации.

<div *ngFor="let item of items"> {{ item }} </div>
  <button (click)="addItem()">Add</button>

items = [1, 2, 3, 4];
  addItem(): void {
    this.items.push(5);
  }