This site describes our support for the AngularJS (1.x) framework. Visit for information on our latest version.


The reorder component creates a list where users can drag-and-drop rows into their preferred order. The rows can display a title and description.

Reorder settings

  • bb-reorder — Creates a list where users can drag-and-drop rows.
    • bb-reorder-items — Specifies an array of items that users can sort. The array should contain objects that provide title and description properties.


Current order:

  • {{item.title}}


<div ng-controller="ReorderTestController as reorderCtrl">
  <div style="width: 300px">
    <bb-reorder bb-reorder-items="reorderCtrl.itemsToSort"></bb-reorder>

  <div style="margin-top: 10px;">
    <h4>Current order:</h4>

    <ul ng-repeat="item in reorderCtrl.itemsToSort">


/* global angular*/

(function () {
    'use strict';

    function ReorderTestController() {
        var vm = this;

        vm.itemsToSort = [
                title: 'Title 1',
                description: 'Description 1'
                title: 'Title 2',
                description: 'Description 2'
                title: 'Title 3',
                description: 'Description 3'
                title: 'Title 4',
                description: 'Description 4'

        .controller('ReorderTestController', ReorderTestController);