[英]Angular DOM reorder elements in QueryList
I have a QueryList of objects.我有一个对象的 QueryList。 I need to reorder the DOM element based on user interaction:
我需要根据用户交互重新排序 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
The QueryList is sorted but the order in my view stays the same. QueryList 已排序,但我认为的顺序保持不变。 I need to reorder the view as well.
我还需要重新排序视图。 Any idea how I can dynamically sort the view based on QueryList?
知道如何根据 QueryList 对视图进行动态排序吗?
Let say I have假设我有
<temp #mytemplate *ngFor="let n of nums">
this generates这会产生
<temp user1>
<temp user2>
<temp user3>
In my component I sort the QueryList and now I want the view do the same and shows在我的组件中,我对 QueryList 进行排序,现在我希望视图执行相同的操作并显示
<temp user2>
<temp user3>
<temp user1>
Something is generally wrong if we feel the need to modify the DOM directly.如果我们觉得需要直接修改 DOM,那通常是有问题的。 In Angular we build our HTML from our model.
在 Angular 中,我们从 model 构建 HTML。 So in this case you should just reorder your model.
因此,在这种情况下,您只需重新订购 model。
nums = [ 1, 2, 3 ];
sort() {
this.nums = [ 2, 3, 1 ];
}
This is obviously a highly abstracted answer to your highly abstracted question.这显然是对您高度抽象的问题的高度抽象的答案。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.