AngularJs pass value to ng-click function
AngularJs pass value to ng-click function inside ng-repeat – We sometimes need to pass parameters to ng-click inside the ng-repeat. It is very simple to pass variables to the ng-click function. Here in this tutorial we are going to explain how you can parameters to the ng-click function. You can use our online editor to edit and run the code online.
AngularJs pass value to ng-click function inside ng-repeat
You can pass the values to the ng-click functions simply as below-
AngularJs pass value to ng-click function inside ng-repeat
<!DOCTYPE html>
<html lang="en">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<script>
var myApp = angular.module("myApp", []);
myApp.controller("myController", function($scope) {
$scope.message = '';
$scope.rows = [{'id':11, 'name':'John'}, {'id':10, 'name':'Kelly'}, {'id':1, 'name':'Rimmy'}, {'id':101, 'name':'Kat'}, {'id':1, 'name':'Yesha'}, {'id':1, 'name':'Robert'}];
$scope.removeRow = function(index, id) {
if(index != -1){
$scope.rows.splice(index,1);
$scope.message = "User with id "+id+' removed successfully.';
// do other stuffs such as perform ajax request if want to delete data from
//server
}
};
});
</script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="myController">
<span style='color:green;font-weight:bold;'>{{message}}</span>
<table>
<tr><th>Id</th><th>Name</th></tr>
<tr ng-repeat="content in rows">
<td>{{content.id}}</td> <td>{{content.name}}</td>
<td><a href="#" ng-click="removeRow($index, content.id)">Remove</a></td>
</tr>
</table>
</div>
</div>
</body>
</html>
|
Now everything is ready just run the above example to see the demo. If you run the above example it will produce the output something like this –
Advertisements
