JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app='myApp' ng-controller="ArrayController">
    <select id="select" size="9" ng-model="persons" ng-options="item as item.name for item in peoples track by item.name" multiple></select>
    <br/>
    <button ng-click="moveUp()">Up</button>
    <br/>
    <button ng-click="moveDown()">Down</button>
    <br/>
</div>

JavaScript

var app = angular.module('myApp', []);
app.controller('ArrayController', function ($scope) {
    $scope.peoples = [{
        name: 'Jacob'
    }, {
        name: 'Sunny'
    }, {
        name: 'Lenu'
    }, {
        name: 'Mathew'
    }, {
        name: 'Ferix'
    }, {
        name: 'Kitex'
    }];
    
        
    $scope.moveUp = function () {
        var prevIdx = -1;
        var person = $scope.persons.concat();
        console.log($scope.persons);
        for(var i = 0; i < $scope.persons.length; i++) {
            var idx = $scope.peoples.indexOf($scope.persons[i])
            console.log(idx);
            if (idx-1 === prevIdx) {
                prevIdx = idx
            } else if (idx > 0) {
                var itemToMove = $scope.peoples.splice(idx, 1)
                console.log(itemToMove[0])
                $scope.peoples.splice(idx-1, 0, itemToMove[0]);
                
            }
        }
    };
    
   $scope.moveDown = function () {
       var prevIdx = $scope.peoples.length;
       console.log($scope.persons)
       var revPerson = $scope.persons.concat();
       revPerson.reverse();
        for(var i = 0; i < revPerson.length; i++) {
            var idx = $scope.peoples.indexOf(revPerson[i])
            console.log('idx:' + idx, 'prevIdx:' + prevIdx);
            
            if (idx+1 === prevIdx) {
                prevIdx = idx
            } else if (idx < $scope.peoples.length-1) {
                var itemToMove = $scope.peoples.splice(idx, 1)
                console.log(itemToMove[0])
                $scope.peoples.splice(idx+1, 0, itemToMove[0]);
                
            }
        }
    };    
});