Press "Enter" to skip to content

Angular Sortable with Hammerjs, Support SSR | ngx-hm-sortable

NGX-HM-Sortable is an angular 5+ Drag’drop that supports the server-side. Angular sortable with Hammerjs, SSR Support (server-side rendering).

kendo sortable angular, table sorting in angular, mat sort angular, kendo sortable angular disabled, progresskendo angular sortable, angular material table sort

How to make use of it:


npm install ngx-hm-sortable


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

  declarations: [ ...something... ],
  imports: [ ...something... , NgxHmSortableModule],
  providers: [ ...something... ],
  bootstrap: [ ...something... ]
export class YourModule {
import { Component } from '@angular/core';

  ... something ...
export class YourComponent {
  list = [1, 2, 3, 4, 5];
    <tr *ngFor="let item of list; let i = index;" [attr.index]="i" class="item">
        <span class="drag">dragMe!</span>


[ngx-hm-sortable]yesArraycontaineradd sortable by item array.
[elms-selector]yesStringcontainerthe sortable items selector
[move-selector]no (elms-selector)Stringcontainerthe move Anchor
[sortable-id]no / (random)Stringcontainerthe container unique id
[sortable-enable]no / (true)Booleancontainersortable enable state, default
[moving-class]nostringcontaineradd class with selected new element
[selected-class]nostringcontaineradd class with selected origin element.
(sort-complete)no(Array)=>voidcontainerwhen sortable complete, emit this new array
[attr.index]yesNumber(Integer)itemthe index of array


sortable component for angular, ngx-hm-sortable Plugin/Github

See Demo And Download

Official Website(ZouYouShun): Click Here

This superior jQuery/javascript plugin is developed by ZouYouShun. For extra advanced usage, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *