扩展角度选择模型以通过鼠标拖动来处理选择

时间:2015-03-27 12:45:07

标签: angularjs

我正在使用指令angular-selection-model来创建可选列表。

编辑:

我有一个由以下代码生成的可选列表:

in codepen

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.min.js"></script>
<script src="https://cdn.rawgit.com/jtrussell/angular-selection-model/master/dist/selection-model.js"></script>

<div ng-app="theApp" ng-controller="controller"> 
   <ul>
     <li ng-repeat="item in stuff track by $index" selection-model selection-model-mode="multiple-additive">
       {{item.label}} - {{item.selected}}
     </li>
  </ul>
</div>

JS:

var myapp = angular.module('theApp', ['selectionModel']);

    myapp.controller('controller', function ($scope) {  
      $scope.stuff = [
            {selected: false, label: 'Scotchy scotch'},
            {selected: true, label: 'Monacle'},
            {selected: true, label: 'Curly mustache'},
            {selected: false, label: 'Top hat'}
      ];  
    });

我希望能够通过鼠标拖动选择多个对象 - 如this示例中所示。如何启用此功能?

1 个答案:

答案 0 :(得分:1)

以下是角度拖动选择的一些示例

很抱歉只在链接中给出答案,但您可能比我的解释理解得足够好。

1) http://jsfiddle.net/few5E/

2) https://github.com/willgm/ngSelectable

3) https://github.com/jonotron/angular-selectable