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 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======================^