Référence API

Voici le contrat complet de sortable : tout ce que vous pouvez lier, écouter, projeter et personnaliser, réuni au même endroit. Branchez ce dont vous avez besoin et stylisez ce que vous voulez — c’est standalone et compatible avec les signals.

Inputs

Réglez sortable à votre goût avec 13 inputs. Liez-les comme n’importe quel @Input Angular.

Nom	Type	Par défaut	Description
`hubSortable`Obligatoire	`T[] \| FormArray \| WritableSignal<T[]>`	—	Données liées au conteneur triable : un tableau simple, un `FormArray` réactif ou un signal modifiable. Reste synchronisé avec les opérations de glisser-déposer.
`options`	`Options`	—	Objet complet d'options SortableJS. Chaque option SortableJS peut aussi être liée directement comme son propre input (par exemple `handle`, `animation` ou `group`).
`autoUpdateArray`	`boolean`	`true`	À `true` (par défaut), la directive met à jour automatiquement le tableau lié après chaque glissement. Mettez `false` pour un contrôle manuel et mettez le tableau à jour vous-même.
`cloneFunction`	`(item: T) => T`	—	Fonction utilisée pour cloner un élément lorsque le groupe est configuré en mode `pull: 'clone'`.
`container`	`string`	—	Sélecteur CSS de l'élément imbriqué qui doit devenir triable lorsque l'hôte enveloppe la liste réelle.
`group`	`Options['group']`	—	Nom ou objet de configuration du groupe pour connecter plusieurs listes et contrôler lesquelles peuvent céder ou recevoir des éléments.
`sort`	`boolean`	—	Active ou désactive la réorganisation des éléments au sein de la liste.
`handle`	`string`	—	Sélecteur CSS de l'élément, à l'intérieur de chaque item, qui démarre le glissement, laissant le reste interactif.
`draggable`	`string`	—	Sélecteur CSS qui restreint les éléments enfants pouvant être glissés.
`filter`	`string \| ((event, target, sortable) => boolean)`	—	Sélecteur CSS (ou prédicat) marquant les éléments non déplaçables.
`disabled`	`boolean`	—	Désactive le comportement triable sans retirer la directive.
`animation`	`number`	—	Durée en millisecondes de l'animation de réorganisation.
`ghostClass`	`string`	—	Classe CSS appliquée au repère affiché pendant le glissement.

Outputs

Réagissez à ce que fait sortable — 13 événements sur lesquels accrocher votre logique.

Nom	Type	Description
`init`	`Sortable`	Émis une fois l'instance SortableJS sous-jacente créée.
`start`	`SortableEvent`	Émis au début d'une opération de glissement.
`end`	`SortableEvent`	Émis à la fin d'une opération de glissement, quel que soit le résultat.
`add`	`SortableEvent`	Émis lorsqu'un élément est déposé dans cette liste depuis une autre.
`update`	`SortableEvent`	Émis lorsqu'un élément change de position au sein de la même liste.
`sortEvent`	`SortableEvent`	Émis chaque fois que l'ordre de la liste change (après `add` ou `update`).
`remove`	`SortableEvent`	Émis lorsqu'un élément quitte cette liste vers une autre.
`filterEvent`	`SortableEvent`	Émis lorsqu'on tente de glisser un élément filtré (non déplaçable).
`change`	`SortableEvent`	Émis lorsque la liste change suite à un ajout ou une suppression.
`choose`	`SortableEvent`	Émis lorsqu'un élément est choisi (appui du pointeur).
`unchoose`	`SortableEvent`	Émis lorsqu'un élément est relâché sans avoir été glissé.
`clone`	`SortableEvent`	Émis lorsqu'un élément est cloné en mode clonage.
`move`	`SortableMoveEventPayload`	Émis en continu pendant le glissement ; sa valeur de retour peut contrôler si le déplacement est autorisé.

Templates

Aucun template documenté pour le moment.

Variables CSS

Aucune variable CSS documentée pour le moment.

Styles et theming

Aucun exemple de style n’est encore documenté. Cette section inclura des recettes de personnalisation et des exemples de theming.