Deleting from an array in $scope and updating html on page

Question

Deleting from an array in $scope and updating html on page

So, the issue I'm having is I have an array in my controller $scope called $scope.calls and I can push in to that array just fine and have it update on the page. Simple stuff. What I want to do is to be able to delete from $scope.calls and have it reflect on the page like that. If you look at $scope.deleteCall(), it deletes it from the array fine but doesn't remove the elements from the page. Is there away to clear out those elements when the data is removed?

http://jsfiddle.net/kyct/6tcW8/75/

javascript
angularjs

Answer 1

The problem was that you were not removing the item from an array really. The correct approach would be:

$scope.deleteCall = function (callIndex) {
    $scope.calls.splice(callIndex, 1);
}

Here is a working jsFiddle: http://jsfiddle.net/UAPhn/