Javascript 使用不识别临时变量形式ng repeat的函数绑定html

我是编程新手，这是我必须发布的第一个问题

我尝试使用

ngbindhtml

将五个图像文件放入由

ngrepeat

创建的div中。这五个图像文件将在

ng repeat

的每个元素之间有所不同

<div ng-repeat = "newGame in myGamesList">
            <div class="col-sm-4 col-lg-4 col-md-4">
                <div class="thumbnail">
                    <div>
                        <img src="{{newGame.thumbnail}}" alt="">
                    </div>
                    <div class="caption">
                        <h4 class="pull-right">{{newGame.price}}</h4>
                        <h4><a ng-style="{'font-size': nameSize((newGame.name | removeSubName).length)}" class="categoryGameName" href="#details/{{myGamesList.indexOf(newGame)}}">{{newGame.name | removeSubName}}</a>
                        </h4>
                        <p>{{newGame.description}}</p>
                    </div>
                    <div id="ratingDiv" style="margin-left: 8px; margin-right: 8px; margin-bottom: 5px;">
                        <div style="display: inline-block" ng-bind-html="trustedHtml"></div>
                        <p class="pull-right" style="color: #d17581">{{newGame.numberReviews}} reviews</p>
                    </div>
                </div>
            </div>
        </div>

如果我将

getStars（newGame）

中的

newGame

替换为代码工作范围下定义的内容，但是使用

newGame

（尝试与

ng repeat=“newGame in myGamesList”

中的临时变量匹配），则不会显示任何内容

如何使

newGame

被识别为被迭代的每个元素

函数

getStars

具有以下代码

$scope.getStars = function(game) {
    var numStars = (game.numberStars);
    iconString = '';
    for (i=0; i<Math.floor(numStars); i++) {
        iconString += '<img style="width:16px" class="starGlyph" src="images/fullStar.png" alt=""/>'
    }
    if (numStars%1 == 0.5) {
        iconString += '<img style="width:16px" class="starGlyph" src="images/halfStar.png" alt=""/>'
    }
    for (j=0; j<(5-Math.ceil(numStars)); j++) {
        iconString += '<img style="width:16px" class="starGlyph" src="images/emptyStar.png" alt=""/>'
    }
    return iconString;
};

$scope.getStars=函数（游戏）{
var numStars=（game.numberStars）；
iconString=''；
对于（i=0；i您的
$scope.html
来自哪里

您应该在
ng bind html
中使用
newGame
，如下所示

<div style="display: inline-block" ng-bind-html="getTrustedHtml(newGame)"></div>

我不完全确定你说“你的$scope.html从何而来？”是什么意思。如果有帮助的话，它是在“myApp”控制器的作用域下声明的。我尝试了你所说的，但它不起作用（没有显示）。我还将var html=$scope.getStars（game.html）；替换为var html=$scope.getStars（game）；这也不起作用。（getStars函数返回一个由5个图像标记组成的字符串，这是我想用ng bind html绑定到我的div中的html。）我的意思是在代码中绑定
$scope.html
，但这永远不会改变，因此在每个ng重复的元素中都是相同的（我也不清楚什么是
myApp
以及您如何在其中访问
newGame
）。您是对的，它应该是
$scope.getStars（游戏）
，我已经修复了我的答案。你能不能控制台.log这行
var html=…
返回什么？如果这是正确的，那应该可以工作。它工作了！我真的不知道为什么我之前试过你编辑答案时它不工作，但现在它工作了！可能是缓存问题，因为你的确切答案解决了它。非常感谢太多了！太好了！别忘了对答案投赞成票，这样它就能帮助其他面临同样问题的人：）谢谢我试着投赞成票，但我需要15个声誉第一，一旦我得到了，我一定会回来投赞成票
<div style="display: inline-block" ng-bind-html="getTrustedHtml(newGame)"></div>

$scope.getTrustedHtml = function(game) {
  // get the game HTML
  var html = $scope.getStars(game);
  // Return it as trusted HTML for ngBindHtml
  return $sce.trustAsHtml(html);
}