Angular js Controller method from HTML with a parameter

Question

Could someone please help me in dealing the below situation.

I have an accordion, on click of accordion it expands.

Depending on header clicked I would like to load the data, or even preload the data.

I have a function in controller with below signature

$scope.getDetailsFn = function(Id){
    $scope.Details = "I am possible"
};

Accordion is as follows

<uib-accordion close-others="oneAtATime" >
   <uib-accordion-group heading="{{x.id}}" ng-repeat="x in xs" >
      //Is the below possible or calling the below on ng-click possible
      {{getDetailsFn({{x.id}})}}
      {{Details}}
      Message: {{x.message}}
      </br>
   </uib-accordion-group>
</uib-accordion>

Srijith · Accepted Answer · 2016-07-06 07:47:25Z

1

From your question, looks like you want to display the data on click of the header? Just do this

<uib-accordion close-others="oneAtATime" >
 <uib-accordion-group heading="{{x.id}}" ng-repeat="x in xs" ng-click="getDetailsFn(x.id)">
  {{Details}}
  Message: {{x.message}}
  </br>
 </uib-accordion-group>
</uib-accordion>

And in the controller you would get 'x', so show the details based on x.

answered Jul 6, 2016 at 7:47

Srijith

1,4449 silver badges14 bronze badges

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

1 Comment

user2934433 Over a year ago

Thank you, it worked! Did not know I can directly refer as x.id without {{ }}.

Collectives™ on Stack Overflow

Angular js Controller method from HTML with a parameter

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related