Передача значения для загрузочного модального всплывающего окна в угловом приложении

Question

Я создал несколько тегов с помощью span & ng-repeat. когда пользователь нажимает кнопку удаления на любом из тегов, я открываю модальное всплывающее окно. Этот модальный поп имеет кнопку удаления. Эта кнопка удаления в свою очередь вызывает одну функцию.

Я хочу передать некоторую информацию этой функции удаления, но я не уверен, как передать идентификатор кнопки удаления в модальное всплывающее окно.

Здесь fiddle для этого.

<div ng-app> 
    <div ng-controller="TodoCtrl"> 
     <div ng-app="" ng-init="names=['One','Two','Three']"> 
      <ul> 
       <li ng-repeat="x in names"> <span class="tag label label-info"> 
    <span>{{x}}</span> 
<a data-toggle="modal" data-target="#confirm-delete"><i class="remove glyphicon glyphicon-remove-sign glyphicon-white"></i></a> 
        </span> 
       </li> 
      </ul> 
     </div> 
     <div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
      <div class="modal-dialog"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
         <h4 class="modal-title" id="myModalLabel">Confirm Delete</h4> 

        </div> 
        <div class="modal-body"> 
         <p>You are about to delete one track, this procedure is irreversible.</p> 
         <p>Do you want to proceed?</p> 
         <p class="debug-url"></p> 
        </div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> <a ng-click="deleteMe()" class="btn btn-danger btn-ok" data-dismiss="modal">Delete</a> 

        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

Добавление ng-click решит вашу проблему. Но этот подход будет немного изменен здесь.

Добавьте ng-click в тег a.

<a data-toggle="modal" ng-click="setID(x)" data-target="#confirm-delete"> 
     <i class="remove glyphicon glyphicon-remove-sign glyphicon-white"> 
     </i> 
    </a> 

А затем добавить переменную временную удерживать значение, которое будет удалено (в вашем случае х)

$scope.setID = function(x) { 
     $scope.valueToBeRemoved = x; 
    }; 

И теперь вы можете получить доступ к этой переменной в методе удаления.

Обновлено plunker here