【问题标题】:How to sort list using Angular Sortable and Rails如何使用 Angular Sortable 和 Rails 对列表进行排序
【发布时间】:2016-07-19 12:33:05
【问题描述】:

我被这个问题困住了。我已经在 Rails 中构建了一个 API,在 Angular 中构建了一个客户端。我有一个名为Todo 的模型,它有一个名为order 的属性。当我创建一个新的 Todo 时,我会自动为新创建的 todo 分配一个值顺序,如下所示:

@todo = Todo.create(todo_params)
@todo.order = Todo.count + 1

并显示所有待办事项:

@todos = Todo.where(...).order(:order.desc)

在我的客户端中,我使用 Sortable 进行 UI 操作,并且有一个名为 onUpdate 的方法为我提供了数组的新索引。

我遇到的问题是索引与我在order 属性中的值有很大不同。当上述函数被调用时,我得到了项目和另外两个值:newIndexoldIndex,但问题是这并没有给我其他 todos 的索引,所以我如何在数据库上重新组织它?

我很感激任何帮助,因为我在这里有点不知所措。

PS:请注意,这只是 Rails API,所以没有意见。

编辑

想要的输出:

让我们想象一下:我在数据库中有三个项目:{name: A, order: 1}, {name: B, order: 2}, {name: C, order: 3}。在前端,使用 ng-repeat 时,每个项目都会有一个$index。假设 A 将具有 $index 值 0、B 1、C 2。目前,当我使用 Angular 库 Sortable 时,当我手动对列表进行排序时,我得到的值是:oldIndexnewIndex 对应于我在数组中移动的项目的位置,但它没有显示数组中所有项目的位置,所以我不知道如何使用这些值的属性来更新对象数据库。

【问题讨论】:

  • 那你是在 Rails 5 上吧?
  • 很遗憾没有(该项目在 Rails 5 发布之前就开始了),所以我们使用的是 Rails 4 并删除了所有视图等。
  • 真正有用的是您期望的某种输出和当前不需要的输出...您使用的是什么数据库?

标签: ruby-on-rails angularjs jquery-ui-sortable rubaxa-sortable


【解决方案1】:

对于任何可能感兴趣的人:最后我使用了以下解决方案:

每次Sortable 更新一个项目时,它还会发送一个数组,其中包含所有项目以正确的顺序排列。然后我遍历数组并用新订单更新每个项目。不确定这是最有效的方法,但它现在解决了问题。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-12-29
    • 1970-01-01
    相关资源
    最近更新 更多