Angular Изменение порядка элементов DOM в QueryList

Question

У меня есть QueryList объектов. Мне нужно изменить порядок элементов DOM на основе взаимодействия с пользователем:

    @ViewChildren('mytemplate') temp: QueryList<MyObjects>;

In ngAfterViewInit :

    let arr = this.temp.toArray();

    // sort the arr here (it gets sorted correctly)

    this.temp.reset(arr) // sorts the temp but DOM elements stays in the same order

QueryList отсортирован, но порядок в моем представлении остается неизменным. Мне нужно изменить порядок зрения. Любая идея, как я могу динамически сортировать представление на основе QueryList?

Допустим, у меня есть

<temp #mytemplate *ngFor="let n of nums"> 

это генерирует

<temp user1>
<temp user2>
<temp user3>

В моем компоненте я сортирую QueryList и теперь я хочу, чтобы представление сделало то же самое и показывает

<temp user2>
<temp user3>
<temp user1>

Answer 1

Что-то обычно не так, если мы чувствуем необходимость изменить DOM напрямую. В Angular мы строим нашу HTML из нашей модели. Так что в этом случае вам следует просто изменить порядок вашей модели.

nums = [ 1, 2, 3 ];

sort() {
  this.nums = [ 2, 3, 1 ];
}

Это, очевидно, весьма обобщенный ответ на ваш весьма обобщенный вопрос.