javascript - 如何在 Angular 对象中使用 for 循环传递给由 $sce 渲染的字符串

Question

我目前正在使用 $sce.trustAsHtml 渲染一大块 html 和指令。

我使用了一个名为compile-template的指令，它允许我使用ng-directives，例如ng-click和ng-disabled。

如果对象是静态的(例如 name: 'wining')，我就可以传入它们，但是如果我使用 forEach 循环遍历它们，我会得到一个 未定义 结果。

示例:

$scope.xxx = {
name: "winning",
array:["test","123","456","888"]
};

var string = 'I am an <code>HTML</code>string with <a href="#" ng-mouseover="removeExp()">links!</a> and other <em>stuff</em> <button ng-click="fire(a)">TEST</button>'
   angular.forEach($scope.xxx.array, function (a) {

string += 'I am an <code>HTML</code>string with <a href="#" ng-mouseover="removeExp()">links!</a> and other <em>stuff</em> <button ng-click="fire(a)">TEST</button> <button ng-click="works(xxx.name)">Works</button>'
  });



 $scope.myHTML =$sce.trustAsHtml(string);

我这里有一个有效的 jsFiddle 示例:http://jsfiddle.net/3J25M/533/

(^打开开发工具查看console.log^)

请注意“工作”按钮如何工作，但“测试”按钮却不起作用。 (“TEST”按钮从 forEach 循环获取其对象属性。)

<小时/>

如何使用 angular.forEach 传递值？

谢谢!

Answer 1

Please check working example: Demo

用以下代码替换 angular.forEach

angular.forEach($scope.xxx.array, function(a) {
  string += 'I am an <code>HTML</code>string with <a href="#" ng-mouseover="removeExp()">links!</a> and other <em>stuff</em> <button ng-click="fire(' + a + ')">TEST</button> <button ng-click="works(xxx.name)">Works</button>'
});

你的问题出在哪里

<button ng-click="fire(a)">TEST</button>

这里你必须将“fire(a)”替换为

fire( ' + a + ') as you are referring variable