get index or id of an <li> element

[Nir-Saado]

Hi,

I am trying to get the id or the index of a specific element inside a ng-repeat. Once I have it, I will send this parameter to the delete function. Any ideas?

Thanks

`

                <ol id="demo2" class="slippylist">
                    <li id="li" ng-repeat="exercise in displayExerciseInProgramArray track by $index" ng-class="filterClass(exercise)"> 

                                <img id="exerciseImg" ng-src="../../static/{{exercise.youtubelogo}}">
                                <div class="exerciseDetailsChildren">
                                    <h5>{{exercise.id}}</h5>
                                    <h5>{{exercise.name}}</h5>
                                </div>
                                <button id="removeExerciseBTN" ng-click="removeExercise(exercise.id, displayExerciseInProgramArray, $index)" type="button" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span></button>

                    </li>
                </ol>

`

    function setupSlip(list) {
        list.addEventListener('slip:beforereorder', function(e){
            if (e.target.classList.contains('demo-no-reorder')) {
                e.preventDefault();
            }
        }, false);
        list.addEventListener('slip:beforeswipe', function(e){
            if (e.target.nodeName == 'INPUT' || e.target.classList.contains('demo-no-swipe')) {
                e.preventDefault();
            }
        }, false);
        list.addEventListener('slip:beforewait', function(e){
            if (e.target.classList.contains('instant')) e.preventDefault();
        }, false);
        list.addEventListener('slip:afterswipe', function(e){
            e.target.parentNode.appendChild(e.target);

            var parent = document.getElementById("demo2");
            var child = e.target;
            parent.removeChild(child);
            console.log($scope.displayExerciseInProgramArray);
            console.log(e.target);

        }, false);
        list.addEventListener('slip:reorder', function(e){

            const movedItem = $scope.displayExerciseInProgramArray[event.detail.originalIndex];
            $scope.displayExerciseInProgramArray.splice(event.detail.originalIndex, 1); // Remove item from the previous position
            $scope.displayExerciseInProgramArray.splice(event.detail.spliceIndex, 0, movedItem); // Insert item in the new position
            e.target.parentNode.insertBefore(e.target, e.detail.insertBefore);

            return false;
        }, false);

        return new Slip(list);

    }

    setupSlip(document.getElementById('demo2'));

`

[carter-thaxton]

You could try using a data attribute on the element within the ng-repeat. Slip provides access to the DOM element, but you'll have to setup the association to any models yourself.