javascript - 显示使用 AngularJS 获取的记录时如何在 View 内部循环？

Question

我开始学习 AngularJS。我对 JavaScript/jQuery 很有经验，但我现在在理解 AngularJS 的基础知识时遇到了一些困难。我有一个简短的问题想问任何有一点经验的人。

我有一个显示“用户”的表(这将来自 GET 查询)。

每个“users in users”的架构如下:{name:'', rating:4, reviews:10}

Rating 是一个从 1 到 5 的整数，其中每个代表一颗星(共 5 颗可能的星)。对于评分中的每个整数，我想绘制一个显示单个星的 IMG 标签。

所以我有这样的东西:

<tbody>
    <tr ng-repeat="user in users">
        <td>{{user.name}}</td>
        <td>
            <img src="star.jpg" ng-repeat="n in 1 .. user.rating">
        </td>
        <td>{{user.reviews}}</td>
    </tr>
</tbody>

知道如何正确设置该循环吗？显然那是行不通的。我希望它使用 {{user.rating}} 来确定需要绘制多少颗星。

感谢您的协助。

Answer 1

对于 ng-repeat，我看到的唯一方法是在范围内定义一个函数，返回一个包含 n 个元素的数组:

$scope.stars = function(amount) {
    var result = [];
    for (var i = 0; i < amount; i++) {
         result.push(i);
    }
    return result;
}

然后，在 View 中，使用

ng-repeat="star in stars(user.rating)"

但您也可以定义自己的指令，循环显示指令主体 N 次。