AngularJS使ng-bind-html成为动态构造的对象名

Question

我需要在HTML代码中设置一个绑定到动态创建的名称，如：

<div ng-bind-html="MyVariable_{{counter}}">

在控制器中我使用以下代码：

        var the_string = 'MyVariable_' + p ;
        var MyHTML     = '<font size="' + p + '">This is text with size depending on the index</font>' ;

        var dummy = $parse(the_string);
        dummy.assign($scope, $sce.trustAsHtml(MyHTML));

澄清注释：HTML中的{{counter}}是传递给javascript代码的参数“p”。

问题似乎在HTML中...... AngularJS不喜欢我在HTML中使用的语法（即="MyVariable_{{counter}}"）。有没有办法实现这个目标？

感谢。

Answer 1

使用功能

ng-bind-html="getHtml(counter)"

你的javascript看起来像这样

function getHtml(counter) {
   return $scope['MyVariable_' + counter];
}