Question

我正在使用可排序的JQueryUI和Angular 7创建动画可重排序列表。到目前为止，它运行良好，但是当我在对列表重新排序后尝试添加新对象时，就会出现问题。

模板：

                        <img class="img-fluid" src="{{sticker[0]}}">
                        <div class="manage-buttons row mx-0">
                            <div class="col-6 p-0">
                                <!--<button class="m-0 p-0 edit btn btn-sm btn-primary">Edit</button>-->
                            </div>
                            <div class="col-6 p-0">
                                <button class="m-0 p-0 delete btn btn-sm btn-danger">Delete</button>
                            </div>
                        </div>

我只是这样添加新的obj：

    this.stickers.push(['assets/img/cho-choo.jpg']);

在没有重新排序的情况下添加效果很好，“ choo-choo.jpg”位于列表的末尾。

但是在重新排序后，当我尝试添加新图像时，图像将转到可排序列表内容的中间（即使选择项位于我在数组中使用的数组的最后一个索引） ngFor）。

如何解决此问题，并使ngFor呈现列表项在阵列中的位置？

Answer 1

不要推送数组。只需推动项目

df <- data.frame(y = c(1,2,3), y1 = c(2,3,4), y2 = c(1000, 100, 10))

txt <- c("Round to 1000", "Round to 100", "Round to 10", "None")
div <- c(1000, 100, 10, 1)
df$Type <- lapply(df$y2, function(x) {
  txt[which.max(unlist(lapply(div, function(y) (x %% y) == 0)))]
})
#> df
#y y1   y2          Type
#1 1  2 1000 Round to 1000
#2 2  3  100  Round to 100
#3 3  4   10   Round to 10

带有JQueryUI Sortable的Angular7 ngFor-奇怪的数组渲染行为

1 个答案: