How to remove elements in Angular?

Question

JavaScript

I wrote the following code that creates DOM elements:

<tr ng-repeat="allowedMac in allowedMacs">
        <td class="td-username">{{allowedMac.name}}</td>
        <td class="td-ipaddress">{{allowedMac.ip}}</td>
        <td class="td-macaddress">{{allowedMac.mac}}</td>
        <td class="td-date">{{allowedMac.date}}
          <button class="delete-record" ng-click="">&#10060</button>
        </td>
      </tr>

How to hang on each created element ng-click, which will remove it? Removal, as I understand it, is to remove an entry from the allowedMacs array. How to take the contents of {{allowedMac.mac}} after ng-click is fired to send a POST request?

Answer 1

<button ng-click="removeAddr(allowedMac)">remove</button>

var allowedMacs = [];

function removeAddr(allowedMac) {
  $http.delete('/macs/' + allowedMac.mac).then(function (response) {
    if (response.success) {
      allowedMacs.splice(allowedMacs.indexOf(allowedMac), 1);
  });
}