Setting your array index to selected from a angular bootstrap modal on close

Question

I have been following the angular ui modal on this link https://angular-ui.github.io/bootstrap/#/modal.

Everything is working just fine, and I am able to select the index for the array $scope.comps= ['item1', 'item2', 'item3'].

My parent page, when closing the model has a form that shows only one comps at a time with next, previous, last, first buttons:

$scope.getNext = function () {
        $scope.index = $scope.index + 1;
        $scope.comp = $scope.comps[$scope.index];
    }
    $scope.getLast = function () {
        $scope.index = $scope.comps.length - 1;
        $scope.comp = $scope.comps[$scope.index];
    }

    $scope.getPrevious = function () {
        $scope.index = $scope.index - 1;
        $scope.comp = $scope.comps[$scope.index];
    }
    $scope.getFirst = function () {
        $scope.comp = $scope.comps[0];
    }

How do I set my $scope.comp, to the selected index after I close the modal

I have tried to set my $scope.comp in the $uibModalInstance.close function as below, but when I close the modal it doesn't take me to any $scope.comp and remains on the same.

$scope.ok = function () {
       $uibModalInstance.close($scope.comp = $scope.comps[$scope.selected.index]);
       ;
    };

OR

$scope.ok = function () {
       $uibModalInstance.close($scope.selected.index);
       $scope.comp = $scope.comps[$scope.selected.index]);

    };

Answer 1

I resolved this by passing my $index back to the modalInstance.result.then function:

 modalInstance.result.then(
   function (selectedItem) {
        $scope.selected = selectedItem;
        $scope.comp = $scope.comps[$scope.selected];
    }
 );

Answer 2

Maybe you can do something like this. It will return the index of the selected item.

$uibModalInstance.close($scope.comps.indexOf($scope.selected));