CODEWITHSUNDEEP
javascriptangularjs
Abhishek
Abhishek

Reputation: 3066

Angularjs passing parameter values in ng-click function

I have an angular app where i have a custom filter defined as sumCompletedCredits. Here is the html of the call:

{% if node.is_leaf_node %}
     <span class="badge badge-success" 
        ng-bind="mpttdetails | filter:{category.id:{{node.id}}} | sumCompletedCredits">
    </span>

    <div class="row">
        <button class="btn btn-default btn-sm pull-right" 
            ng-click="open({{node.id}}, {{node.min_credit}})">Add Course <span class="glyphicon glyphicon-plus"></span>
        </button>
    </div>
{%endif%}

Here is the custom filter definition:

app.filter('sumCompletedCredits', function () {
    return function (mpttdetails) {
        if(typeof mpttdetails === 'undefined'){
                return;
        }
        else {
            var sum = 0;
            mpttdetails.forEach(function (detail) {
                sum += detail.student_academic_credit.credit;
            });
            return sum;
         }
        };
});

Here is what i want to achieve: I would like to pass a 3rd parameter in the button's ng-click() function where the parameter would be the value from the above span like the follows:

ng-click="open({{node.id}}, {{node.min_credit}}, *{{{this content will be the value in the badge class from the custom filter}}}*)"

So basically i am trying to send the value that will be displayed in the span badge just before the button and send that value as the third parameter.How do i send the third detail?

Upvotes: 1

Views: 2796

Answers (1)

gkalpak
gkalpak

Reputation: 48211

You can assign the result of the filtering to a scope property and reference that property in your function:

<span ...
        ng-bind="summed=(mpttdetails | filter:{category.id:{{node.id}}} | 
                                       sumCompletedCredits)">
</span>
...
<button ...
        ng-click="open({{node.id}}, {{node.min_credit}}, summed)">
    ...
</button>

Upvotes: 5

Related Questions