Angular: pass dynamic parameter to controller

Question

I would like to find out how I can pass a parameter that was dynamically created using ng-repeat back to the controller by calling a controller function.

Currently when I call showItem('{{item.item_id}}'); I see {{item.item_id}} in my controller function. If I leave the parenthesis off, it seems like the function is not being called (no output in console.log).

$scope.showItem = function(itemId) {
		console.log('show item '+itemId);
	}

<ul ng-repeat="items in data">
  <li>
    <a ng-click="showItem('{{items.item_id}}')" href="javascript:void(0);" >
      {{items.name}}
    </a>
  </li>	
</ul>

JB Nizet · Accepted Answer · 2015-05-07 10:43:42Z

2

<a ng-click="showItem(item.item_id)" href="">

Note that an empty href is all you need to prevent navigation.

Also note that you could have found that by looking at the documentation, which explains what ng-click expects (an expression), and has examples.

edited May 7, 2015 at 10:43

answered May 7, 2015 at 10:39

JB Nizet

694k94 gold badges1.3k silver badges1.3k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ved Over a year ago

I love your answers. Always follow your answer as learning tip for angularJS.

Patrice Poliquin Over a year ago

I tried to make the samething here is my example. Simplified code. <div data-ng-repeat="indicator in competence.indicators" class="content level2"> <a ng-click="listAllRestulatsByIndicateurId(indicator.id)" href="javascript:void(0);">Click me</a> </div> But my HTML do not write the correct parameter in the function. I tried to show it with {{indicator.id}} and it worked.

Arulkumar · Accepted Answer · 2016-01-22 06:20:57Z

1

Just pass it without interpolation:

<ul ng-repeat="item in data">
  <li>
    <a ng-click="showItem(item.item_id)" href="javascript:void(0);">
      {{item.name}}
    </a>
  </li> 
</ul>

edited Jan 22, 2016 at 6:20

Arulkumar

13.3k15 gold badges51 silver badges76 bronze badges

answered May 7, 2015 at 10:39

Phuong Nguyen

3,1401 gold badge18 silver badges27 bronze badges

Collectives™ on Stack Overflow

Angular: pass dynamic parameter to controller

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related