You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+41-36
Original file line number
Diff line number
Diff line change
@@ -6,62 +6,67 @@ Angular 1 module that integrates with Sortable.js
6
6
# Installation
7
7
8
8
## Install with NPM
9
-
npm install angular-legacy-sortablejs
9
+
10
+
npm install angular-legacy-sortablejs
11
+
10
12
11
13
# Examples
12
14
13
15
## Simple Drag and Drop
14
-
```
16
+
17
+
```js
15
18
angular.module('exampleApp', [])
16
-
.component('dragAndDropExample', {
17
-
template: `<ul ng-sortable>
18
-
<li ng-repeat="item in ['burgers', 'chips', 'hotdog']">
19
-
{$ item $}
20
-
</li>
21
-
</ul>`,
22
-
})
19
+
.component('dragAndDropExample', {
20
+
template:`<ul ng-sortable>
21
+
<li ng-repeat="item in ['burgers', 'chips', 'hotdog']">
22
+
{$ item $}
23
+
</li>
24
+
</ul>`,
25
+
})
23
26
```
24
27
25
28
## Specifying a Config
26
29
You can pass a Config obj to `ng-sortable` and it will pass this onto the created sortable object. The available options can be found [here](https://github.com/RubaXa/Sortable#options)
27
-
```
30
+
31
+
```js
28
32
angular.module('exampleApp', [])
29
-
.component('dragAndDropExample', {
30
-
template: `<ul ng-sortable=$ctrl.sortableConf>
31
-
<li ng-repeat="item in ['burgers', 'chips', 'hotdog']">
32
-
{$ item $}
33
-
</li>
34
-
</ul>`,
35
-
controller: function AppSidebarController() {
36
-
var ctrl = this;
37
-
ctrl.sortableConf = {
33
+
.component('dragAndDropExample', {
34
+
template:`<ul ng-sortable=$ctrl.sortableConf>
35
+
<li ng-repeat="item in ['burgers', 'chips', 'hotdog']">
36
+
{$ item $}
37
+
</li>
38
+
</ul>`,
39
+
controller:functionAppSidebarController() {
40
+
var ctrl =this;
41
+
ctrl.sortableConf= {
38
42
animation:350,
39
43
chosenClass:'sortable-chosen',
40
44
forceFallback:true,
41
-
};
42
-
},
43
-
})
45
+
};
46
+
},
47
+
});
44
48
```
45
49
46
50
# Drag handle
47
51
Example showing how use the handle option
48
-
```
52
+
53
+
```js
49
54
angular.module('exampleApp', [])
50
-
.component('dragAndDropExample', {
51
-
template: `<ul ng-sortable=$ctrl.sortableConf>
52
-
<li ng-repeat="item in ['burgers', 'chips', 'hotdog']" draggable="false">
53
-
<span class="grab-handle">Drag Header</span>
54
-
<div>{$ item $}</div>
55
-
</li>
56
-
</ul>`,
57
-
controller: function AppSidebarController() {
58
-
var ctrl = this;
59
-
ctrl.sortableConf = {
55
+
.component('dragAndDropExample', {
56
+
template:`<ul ng-sortable=$ctrl.sortableConf>
57
+
<li ng-repeat="item in ['burgers', 'chips', 'hotdog']" draggable="false">
0 commit comments