With the help of Angularjs, We can dynamically add or remove list items in an array. It is shown In the example given below.
![](http://findnerd.s3.amazonaws.com/imagedata/8652/8652.png)
Addition of the list items is done using 'push' method and removal of the item is done using “splice” method. Controller-
<div ng-app="myApp">
<ul ng-controller="ItemsController" class="nav">
<input type="text" value="ItemName" ng-model="newItemName"
placeholder="name of new item...">
<button ng-click="addItem()">Add Me</button>
<li ng-repeat="item in items.data" id="item{{item.id}}">
<a href="#">{{item.title}}</a> <a ng-click="deleteItem($index)" class="delete-item">x</a>
</li>
</ul>
</div>
'push' Method-
$scope.addItem = function (index) {
items.data.push({
id: $scope.items.data.length + 1,
title: $scope.newItemName
});
}
“splice” Mehod-
$scope.deleteItem = function (index) {
items.data.splice(index, 1);
}
0 Comment(s)