Call an AngularJS function inside HTML

Issue

I was trying to see if there is a way to call a function I designed inside the scope:

<ul class="ui-listview ui-radiobutton" ng-repeat="meter in meters">
    <li class = "ui-divider">
        {{meter.DESCRIPTION}}
        {{htmlgeneration}}
    </li>
</ul>

$scope.htmlgeneration = function()
{
    ...
}

The function is called htmlgeneration. Essentially, what I want to do is dynamically append HTML inside the li element while using AngularJS.

Solution

Yep, just add parenthesis (calling the function). Make sure the function is in scope and actually returns something.

<ul class="ui-listview ui-radiobutton" ng-repeat="meter in meters">
  <li class = "ui-divider">
    {{ meter.DESCRIPTION }}
    {{ htmlgeneration() }}
  </li>
</ul>

Answered By - SomeKittens