2

A follow up to this question: AngularJS data bind in ng-bind-html?

What if the values which I want to interpolate are attached to a ng-repeat created scope?

myDict = {'Suggestion' : $interpolate('Vote here if you think {{player.name}} is right!')($scope) 
          ...};// $scope is wrongly passed here as 'player' is not a scope variable,

And then


<div ng-repeat="player in players">
    <span ng-bind-html="myDict['Suggestion']"></span>
</div>

Is it possible to do such a thing without a custom directive?

Community
  • 1
  • 1
user2263786
  • 131
  • 1
  • 1
  • 9

1 Answers1

1

Thankfully, you're the one deciding when you call the function:

$scope.myDict = function (scope) {
  return {'Suggestion' : $interpolate('Vote here if you think {{player.name}} is right!')(scope);
}

Then in your HTML:

<div ng-repeat="player in players">
    <span ng-bind-html="myDict({player: player})['Suggestion']"></span>
</div>

This will call the function once per player with an object literal, and pass this as the "scope" for the $interpolate call.

Be warned, however: if you have thousands of records, calling a function everytime might have some sort of perf. hit. The only way around it I can think of is using {{players[$index].name}} in the $interpolate call...

Ven
  • 19,015
  • 2
  • 41
  • 61