Banana Banana - 1 year ago 49
AngularJS Question

How to pass an id from view(HTML) to an AngularJs controller when onclick event is triggered?

I am building an application using ASP.NET and AngularJs. I am trying to pass object id from the view (HTML) to the Angular controller, to then make an http call to the api. I don't know how to pass the id of an specific object from this table when the delete link is clicked.

<table class="table table-responsive table-striped">
<tr ng-repeat="post in viewModel.posts">

<td>{{ post.text }}</td>
<td>{{ post.postedOn | date:'medium' }}</td>
<td><a href="#" class="btn btn-sm">Edit</a></td>

<td><a ng-click="viewModel.deletePost" class="btn btn-sm">Delete</a></td>


and this is how I am trying to make the call to the API from the controller

// delete post function
viewModel.deletePost = function () {

viewModel.errorMessage = "";

.then(function (response) {

// sucess delete

viewModel.newPost = {};

}, function () {
// failed to delete

viewModel.errorMessage = "Failed to delete post"
.finally(function () {


Does anybody know how can I pass the id of the respective post on the row clicked to the Angular controller?

Answer Source

viewModel.deletePost is a function - just call it with parameters.

<a ng-click="viewModel.deletePost(" class="btn btn-sm">Delete</a>

After that you just have to add the parameter to the function:

viewModel.deletePost = function (id) { ... }