在指令中附加HTML與範圍值

我正在嘗試製作餅圖指令，並且我使用了高圖，但我也想添加另一行文本，例如'60％'左右。到目前爲止，我試過這個在指令中附加HTML與範圍值

app.directive('pieGraph', function($compile) { 
    return { 
    restrict: 'C', 
    scope: { 
     value: '@', 
     color: '@' 
    }, 
    link: function(scope, elem) { 
     elem.highcharts({ 
     chart: { 
      type: 'pie', 
      backgroundColor: null 
     }, 
     title: { 
      text: null 
     }, 
     yAxis: { 
      title: { 
      text: 'Total percent market share' 
      } 
     }, 
     plotOptions: { 
      pie: { 
      shadow: true 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     credits: { 
      enabled: false 
     }, 
     exporting: { 
      enabled: false 
     }, 
     tooltip: { 
      enabled: false 
     }, 
     series: [{ 
      name: '', 
      data: [ 
      { 
       name: 'a', 
       y: parseInt(scope.value, 10), 
       color: scope.color 
      }, 
      { 
       name: 'b', 
       y: (100 - parseInt(scope.value, 10)), 
       color: '#ffffff' 
      } 
      ], 
      size: '100%', 
      innerSize: '90%', 
      dataLabels: { 
      enabled: false 
      } 
     }] 
     }); 

     var graph = angular.element('<span class="pie-graph-value">{{scope.value}}<sup>%</sup></span>'); 
     $compile(graph)(scope); 
     elem.append(graph); 
    } 
    }; 
});

但這個問題是，我申請的最後一個，只有％，而不是價值和百分比符號。我在編譯過程中遇到了什麼問題？

先謝謝你了，丹尼爾！

來源

2014-10-02 Pacuraru Daniel

請使用{{value}}或將您的元素編寫爲'<span class="pie-graph-value">' + scope.value + '<sup>%</sup></span>'（注意後者不會稍後更新，因爲該值僅在追加元素時計算一次）。該元素將被渲染，因此對scope的引用是隱式的。

來源

2014-10-02 14:59:18 Sycomor

哦，我的上帝的男人，我不能相信我寫了範圍內的HTML :)謝謝你這麼多的隊友，這個答案幫助我很多！ – 2014-10-02 16:07:54

在指令中附加HTML與範圍值

回答

相關問題