CODEWITHSUNDEEP
javascriptangularjs
Harry Bosh
Harry Bosh

Reputation: 3790

angularjs ng-click function parameter not working with ng-repeat

The event.id is rendered/compiled correctly in the html text but the function does not recieve it correctly. even when it shows it correctly in the source, whats going on here?

<span ng-repeat="event in [{"id":"dxczhlyvmblc","name":"4 on 4 - Pickup","venuename":"Box Hill Aqualink","numspotsleft":"<strong>Spots now open<\/strong>","day":"28","dayname":"Wednesday"}]">
    <button ng-click="toggleModal('<% event.id %>')">More detail = <% event.id %></button>
</span>

enter image description here

shopApp.controller('MainController', function($scope, $http, $q){
    $scope.toggleModal = function(eventId){
        console.log(eventId+" toggle");
    };})

Note i am using <% in stead of {{ because of the templating engine.

Upvotes: 1

Views: 487

Answers (2)

Michel
Michel

Reputation: 28249

As you want to pass the value of event.id to the toggleModal function:

<button ng-click="toggleModal(event.id)">More detail = <% event.id %></button>

Upvotes: 1

charlietfl
charlietfl

Reputation: 171679

Arguments for functions in view don't use angular templating expressions.

Change to:

ng-click="toggleModal(event.id)"

You may also find it more convenient to pass the whole object in if you want to pass that object to a modal controller for example

Upvotes: 2

Related Questions