ngx-hm-sortable v1.0.0

ngx-hm-sortable GitHub

Upgrade to Angular 6+ and Rxjs6+

Angular sortable with hammerjs, support SSR(server side rendering).

Demo

Install

1. install

npm install ngx-hm-sortable

Example

1. Module

import { NgxHmSortableModule } from 'ngx-hm-sortable';

@NgModule({
  declarations: [ ...something... ],
  imports: [ ...something... , NgxHmSortableModule],
  providers: [ ...something... ],
  bootstrap: [ ...something... ]
})
export class YourModule {
  ...something...
}

2. TS

import { Component } from '@angular/core';

@Component({
  ... something ...
})
export class YourComponent {
  list = [1, 2, 3, 4, 5];
}

3. HTML

<table>
  <tbody
    [ngx-hm-sortable]="list"
    elms-selector=".item"
    move-selector=".drag"
    selected-class="color-blue"
    moving-class="color-red"
    (sort-complete)="complete($event)">
    <tr>
      <th>sortable</th>
      <th>number</th>
    </tr>
    <tr *ngFor="let item of list; let i = index;" [attr.index]="i" class="item">
      <td>
        <span class="drag">dragMe!</span>
      </td>
      <td>{{item}}</td>
    </tr>
  </tbody>
</table>

Attribute