angular, skipping over a value if it has a certain key/value

Question

Bit of a weird problem here - so I will try to explain this as clearly as possible.

I have a simple ng-repeat that will show content based on what has a key value of .active set to true. I let the user scroll through the content with some arrow buttons bound to some ng-clicks. This works great, however I want to exclude one item from the array if it has the key value of side = 'help' attached to it. So basically I want the arrow clicks to skip over it in a sense. I have no control unfortunately where in the array the help item is. So here are the click functions

//flip right
$scope.flipRight = function(index, parent){
    var idx = index + 1;
    if (idx >= $scope.contentHere[parent].sides.length) {
       idx = 0;
    }
    $scope.contentHere[parent].sides[index].active = false;
    $scope.contentHere[parent].sides[idx].active = true;
};
//flip left
$scope.flipLeft = function(index, parent){
    var idx = index - 1;
    if (idx < 0) {
     idx = $scope.contentHere[parent].sides.length - 1;
    }
    $scope.contentHere[parent].sides[index].active = false;
    $scope.contentHere[parent].sides[idx].active = true;
};

So basically what I am trying to figuire out is how to have this logic skip over the item if it has .side = 'help'. I thought about using lodash to _filter the array by items that do not have the value, but it will offset the index so that will not work. I am not sure how to approach this (maybe I am thinking about this incorrectly?), and could use some direction.

Thank you for taking the time to read!

Answer 1

$scope.flipRight = function(index, parent){
var idx = index + 1;
if(idx >= $scope.contentHere[parent].sides.length){
   idx = 0;
}
if($scope.contentHere[parent].sides[idx] == 'help'){
     $scope.flipRight(idx, parent); //Added to skip over to next item
     $scope.contentHere[parent].sides[index].active = false; // Added for the first item does not turn .active to false Issue
     return; // Added to skip execution of following line of codes incase of recursion
}
$scope.contentHere[parent].sides[index].active = false;
$scope.contentHere[parent].sides[idx].active = true;
};

//flip left
$scope.flipLeft = function(index, parent){
var idx = index - 1;
if (idx < 0) {
 idx = $scope.contentHere[parent].sides.length - 1;
}
if($scope.contentHere[parent].sides[idx] == 'help'){
     $scope.flipLeft(idx, parent); //Added to skip over to next item
     $scope.contentHere[parent].sides[index].active = false; // Added for the first item does not turn .active to false Issue
     return; // Added to skip execution of following line of codes incase of recursion
}
$scope.contentHere[parent].sides[index].active = false;
$scope.contentHere[parent].sides[idx].active = true;
};