Question

的OBJ： -

在meteor ToDo示例应用中添加拖放能力。

原因： -

了解学习曲线。

我能想到的是： -

使用jquery UI（作为外部js）并将更新事件绑定到待办事项列表。在li项上有一个数据字段，以便从同一个函数本身执行更新命令。

想知道是否存在更流星的方法..

谢谢！

Answer 1

Meteor的模板引擎（Spark）会在对基础数据进行任何更改时重绘您的TODO列表，我希望这会破坏JQuery UI的正常运行。

考虑将constant用于您的JQuery UI管理区域。

Answer 2

从this回答和劳埃德上面的回答，这是解决方法：

<template name="todos">
...code...
  {{#constant}}
  {{sort_code}}
  {{/constant}}
</template>

-

<div class="todo-text" data-id="{{_id}}">{{text}}</div>

在todo.js

Template.todos.sort_code = function(){
Meteor.defer(function(){
$('#item-list').sortable({
  update: function(e,iq){
    $('div.todo-text',this).each(function(i){
            var id = $(this).attr('data-id');
            Todos.update(id, {$set:{order:i+1}});
  });
  },
});
$( "#item-list" ).disableSelection();
console.log('dd');

});
};

在meteor.js ToDo应用程序中拖放重新排序功能

2 个答案: