这个例子中填充的键是什么

Question

我正在创建星级评分系统。我在 plnkr 上得到了以下示例。但我有一个问题，什么是 "filled" 密钥以及我们为什么要使用它。

var updateStars = function () {
                scope.stars = [];
                for (var i = 0; i < scope.max; i++) {
                    scope.stars.push({
                        filled2: i < scope.ratingValue
                    });
                }
            };

您可以通过以下 link.

找到整个示例

http://embed.plnkr.co/1esaGq/

求推荐。

Answer 1

您正在尝试使用此字段保存信息 => 如果用户填写的星星小部件高于评分值。它是一个包含布尔值的标志，该布尔值包含此表达式的结果。

在您的 html 代码中，您正在遍历这个 stars 数组并打印文字 '\u2605':

'<li ng-repeat="star in stars" ng-class="star" ng-click="toggle($index)">' +
            '\u2605' +
            '</li>' +

所以基本上这个变量只是您的星星数组中的一个布尔占位符，您可以决定使用 css

来设置它的样式

Answer 2

filled key是boolean flag，决定你的星星css.

基本符合：

<ul class="rating">
    <li ng-repeat="star in stars" ng-class="star" ng-click="toggle($index)"></li>
</ul>

ng-class="star" 解析为 ng-class='filled: true/false'。然后在 true 条件下从 css 文件的以下代码中选取颜色：

.rating .filled {
    color: orangered;
}

这个例子中填充的键是什么

what is filled key in this example

angularjs

angular-directive