Search code examples
angularjsangularjs-directiveangularjs-scope

how to remove object from $scope. variable angularjs


How to remove one object from $scope.Profile.address object please help me see below code and image

<tr ng-repeat="x in Profile.addresses">
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.site_name ' name='site_name'></td>
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.street_address ' name='street_address'></td>
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.city ' name='city'></td>
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.state ' name='state'></td>
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.country ' name='country'></td>
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.zip_code ' name='zip_code'></td>
    <td><input type="text" class="form-control" id="inputDefault" ng-model='x.phone_number ' name='phone_number'></td>
    <td><a href="" data-toggle="tooltip" title="Remove Address" ng-click="removeAddress(x.addresses)"><i class="fa fa-close text-danger" aria-hidden="true"></i></a></td>
</tr>

JS

$scope.removeAddress = function(address) {

    var index = $scope.Profile.addresses.indexOf(address);

    if (index != -1)
      $scope.Profile.addresses.splice(index, 1);
    console.log($scope.Profile.addresses);
};

I have 3 objects and I want to remove one please help me enter image description here


Solution

  • I think your code is working fine. You are missing something else in your code. Make sure you are passing variables properly from UI.

      <ul ng-repeat="add in Profile.addresses">
        <li ng-click="removeAddress(add)">
          {{add.address}}:{{add.phone}}
        </li>
      </ul>
    

    Have a look here Link

    It should be ng-click="removeAddress(x)" not ng-click="removeAddress(x.addresses)"

    change======================^