Lista Sortable y Drag and Drop para Angular | ng-hub-ui-sortable

Utilidades sortable y drag-and-drop para Angular sobre arrays, FormArray, flujos con Signals y listas conectadas.

Visión General

Por qué los equipos buscan esta librería

Elige esta librería sortable para Angular cuando necesites ordenación drag and drop que funcione con arrays, formularios reactivos, Signals y builders complejos de interfaz.

Instalación

npm install ng-hub-ui-sortable

Ir a

Ideal para

  • ordenación de tareas
  • editores con FormArray
  • builders de layout
  • gestión de prioridades

Sobre sortable

ng-hub-ui-sortable ayuda a los equipos Angular a reordenar datos de forma natural en productos donde el orden importa: tareas, prioridades, builders de layout o bloques dinámicos de formularios. Resulta especialmente útil cuando necesitas drag and drop sin perder el control sobre las actualizaciones de estado.

Guías de uso

Uso principal

Escenarios básicos de uso para listas sortable.

Ejemplos:
Array simple

Reordena arrays simples.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código
Signals

Vincula datos sortable a señales mutables de Angular.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código

Integración con formularios

Usa sortable con formularios reactivos de Angular.

Ejemplos:
Integración con FormArray

Reordena controles FormArray con drag and drop.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código

Configuración avanzada

Personaliza el comportamiento y las interacciones de SortableJS.

Ejemplos:
Opciones personalizadas

Configura handles, filtros, animación y eventos.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código
Múltiples listas

Conecta listas, clona elementos y controla reglas de transferencia.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código
Constructor de layout

Contenedores sortable anidados con tabs y widgets.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código
Modo manual

Desactiva las actualizaciones automáticas y aplica cambios manualmente.

La vista previa en vivo todavía no está disponible para este ejemplo.

Código

Características clave

Ordenación de arrays y listas

Reordena datos de dominio en Angular sin reinventar el comportamiento drag and drop.

Funciona con FormArray

Encaja bien en formularios dinámicos e interfaces configurables donde los controles deben moverse junto con el modelo.

Flujos drag-and-drop conectados

Gestiona varias listas, transferencias y experiencias tipo builder con manejo de estado adaptado a Angular.

Cambios recientes

No hay entradas de changelog disponibles.