Javascript jquery raty插件通过angularjs设置速率值

我正在尝试使用jquery raty插件对angularjs进行星级评定。我为它创建了一个自定义指令，如下所示：

app.directive("ngStars", function() {
        return {
            restrict: 'A',
            link: function(scope, elem, attrs) {
                $(elem).raty({ 
                   'path': base_url+'images',
                    score:  attrs.score,
                    readOnly: true,
                    hints: ['سىء جدا', 'سىء', 'عادى', 'جديد', 'ممتاز'],
                });
            }
        }
    });

我的html如下所示

<div ng-repeat="place in places">
    <div ng-stars class="star" score={{place.rate}}></div>
</div>

如果我将

score

属性值预定义为

score=“5”

，插件运行良好，但我需要通过angularjs

score=“{{place.rate}}}”

设置分数值，但这不起作用

---

如何解决此问题？

您需要将模板指令与要提供的范围值链接起来

我已经创建了一个小演示，您可以在控制器中使用$scope.rating选项在此处更改评级

模板：'
'+
“
”+
“\u2605”+
“
”+
“
”，
范围：{
额定值：'='，
最大值：'='
},
链接：功能（范围、要素、属性）{
scope.stars=[]；
对于（变量i=0；i

有一个精彩的教程，可以提供更多的解释

有很棒的功能，包括评级功能

指令：

<rating ng-model="rate" max="max" readonly="isReadonly" on-hover="hoveringOver(value)" on-leave="overStar = null"></rating>

---

从由$http.post函数加载的places对象动态加载的速率值。我使用这个插件为我动态生成html。

<rating ng-model="rate" max="max" readonly="isReadonly" on-hover="hoveringOver(value)" on-leave="overStar = null"></rating>

angular.module('ui.bootstrap.demo').controller('RatingDemoCtrl', function ($scope) {
  $scope.rate = 7;
  $scope.max = 10;
  $scope.isReadonly = false;

  $scope.hoveringOver = function(value) {
    $scope.overStar = value;
    $scope.percent = 100 * (value / $scope.max);
  };

  $scope.ratingStates = [
    {stateOn: 'glyphicon-ok-sign', stateOff: 'glyphicon-ok-circle'},
    {stateOn: 'glyphicon-star', stateOff: 'glyphicon-star-empty'},
    {stateOn: 'glyphicon-heart', stateOff: 'glyphicon-ban-circle'},
    {stateOn: 'glyphicon-heart'},
    {stateOff: 'glyphicon-off'}
  ];
});