Как связать значение переменной в AngularJS?

Question

Как склеить значение переменной в AngularJS

HTML:

<div ng-repeat="steps in data" class="card" style="padding:10px 5px 10px 5px; margin-bottom:10px; margin-top:20px; background: url(@routes.Assets.at("images/Assets/icon_move.png")) no-repeat right #FAFBFC; background-position : calc(100% - 10px) 50%;"> 
    {{steps.title}} 
    <div class="pull-right" ng-click="deleteStep(steps);" style="color:#F26063; padding-right: 40px;">Delete</div> 
    <a class="pull-right" ng-click="openAddStep('lg');" style="color:#43C944; padding-right: 20px;">Edit</a> 
</div> 

JavaScript:

$scope.deleteStep = function(steps){ 
    alert('h'); 
    for (var i = $scope.steps.length - 1; i >= 0; i--) { 
     if (!$scope.steps[i].value) { 
      $scope.steps.splice(i, 1); 
     } 
    } 
} 

Answer 1

Вы можете передать текущий индекс в метод удаления, а затем склеить его, как показано ниже, другой вариант заключается в том, чтобы найти индекс объекта data с использованием метода indexOf и сплайсинга

<div class="pull-right" ng-click="deleteStep($index);" style="color:#F26063; padding-right: 40px;">Delete</div> 

JS

$scope.deleteStep = function(index){ 
         $scope.data.splice(index, 1); 
        } 

var app = angular.module('my-app', [], function() {}) 
 

 
app.controller('AppController', function($scope) { 
 

 
    $scope.data = []; 
 
    for (var i = 0; i < 10; i++) { 
 
    $scope.data.push({ 
 
     title: 'Title: ' + i 
 
    }); 
 
    } 
 

 
    $scope.deleteStep = function(index) { 
 
    $scope.data.splice(index, 1); 
 
    } 
 
    $scope.deleteStep2 = function(steps) { 
 
    $scope.data.splice($scope.data.indexOf(steps), 1); 
 
    } 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="my-app"> 
 
    <div ng-controller="AppController"> 
 
    <div ng-repeat="steps in data" class="card" style="padding:10px 5px 10px 5px; margin-bottom:10px; margin-top:20px;"> 
 
     {{steps.title}} 
 
     <div class="pull-right" ng-click="deleteStep($index);" style="color:#F26063; padding-right: 40px;">Delete</div> 
 
     <div class="pull-right" ng-click="deleteStep2(steps);" style="color:#F26063; padding-right: 40px;">Delete 2</div> 
 
     <a class="pull-right" ng-click="openAddStep('lg');" style="color:#43C944; padding-right: 20px;">Edit</a> 
 
    </div> 
 

 

 
    </div> 
 
</div>