在数组上重复的Angularjs指令

Angularjs Directive that repeats over an array

本文关键字：Angularjs 指令 数组      更新时间：2023-09-26

我设置了以下指令：

app.directive('starRating', function () {
    return {
        restrict: 'EA',
        scope: {
            rating: '=rating'
        },
        template:
            '<ul class=''list-unstyled''>' +
                '<li><span class=''glypicon glyphicon-star''></span></li>' +
            '</ul>'
    };
});

然后我有以下HTML：

<star-rating rating="rating"></star-rating>

rating是这样的数组：[1,3,2,4,5]，这意味着第一个评级是1星，第二个评级是3星，等等。

该指令的目标是重复评级的.glyphicon-star图标数量。

您可以使用for循环来连接模板中'ul'内的'li'元素。这比使用ng重复要便宜。你可能根本不需要使用列表（ul和li）。

此外，您的范围可以简单地为：

 scope: {
        rating: '='
    },
相关文章：