使JustGage.js不能按预期运行

Question

我正在尝试把下面的库合并成角。

http://justgage.com/

该指令如下：

app.directive('playerScoreGauge', function() {
  return {
    restrict: 'E',
    scope: {
      info: '='
    },
    template: '<div id="{{info.id}}"></div>',
    link: function(scope, element, attrs) {

      var g = new JustGage({
        id: scope.info.id,
        value: scope.info.score,
        min: 0,
        max: 100,
        title: scope.info.name
      });



    }
  };

});

但是，由于某些原因，指令没有绑定到JustGage对象。

Plnkr这里：http://plnkr.co/edit/hkWOnelZlguYUkUDvSuI

Answer 1

当指令的链接函数运行时，id属性值尚未内插，JustGage无法找到它。

在JustGage中创建$timeout对象--这将把它放在摘要队列的末尾：

link: function(scope, element, attrs) {
   $timeout(function(){
      var g = new JustGage({
        id: scope.info.id,
        value: scope.info.score,
        min: 0,
        max: 100,
        title: scope.info.name
      });
   });
}

(不要忘记将$timeout注入到指令中)