AngularJS |如何包含拖放列表?

时间:2015-06-21 16:45:53

标签: javascript angularjs drag-and-drop

如何将拖放包含到我的列表中?

file:list.tpl.html

<div class="panel-body">
<table class="table table-striped">
  <thead>
  <tr>
    <th>Lp.</th>
    <th>Nazwa</th>
    <th>Estymacja</th>
    <th>Data</th>
    <th>Ico</th>
    <th>Zaznacz jako wykonane</th>
  </tr>
  </thead>
  <tr data-ng-repeat="todo in todos">
    <td>{{$index+1}}. </td>
    <td><span class="done-{{todo.done}}">{{todo.title}}</span></td>
    <td><span class="done-{{todo.done}}">({{todo.estimates}}h)</span></td>
    <td><span class="done-{{todo.done}}">{{todo.date}}</span></td>
    <td><span class="glyphicon glyphicon-{{todo.type.gico}} done-{{todo.done}}"></span></td>
    <td><input type="checkbox" data-ng-model="todo.done" title="Mark Complete" /></td>
  </tr>
</table>

file:list-ctrl.js

app.controller('listCtrl', function ($scope) { 
 $scope.deleteCompleted = function () {
    $scope.$parent.todos = $scope.$parent.todos.filter(function (item) {
      return !item.done;
    });
  };
});

我正在学习AngularJS,谢谢你的帮助!

1 个答案:

答案 0 :(得分:0)

我通常不喜欢在我的代码中添加插件,但在这种情况下,您只需添加一个简单的拖放模块即可。我用 ui-sortable

然后你需要简单地做

    <ul ui-sortable ng-model="items">
  <li ng-repeat="item in items">{{ item }}</li>
</ul>

这是一个列表...我认为不应该是一个非常不同的表

还查看此解决方案: solution

相关问题