獲取Highcharts工具提示以返回一個角度指令？

我們正在嘗試爲我們的Highcharts圖創建一些複雜的工具提示，該圖會顯示一些動態數據，這些動態數據在應用中不會顯示，所以我想最好的選擇是爲所有格式創建一個角度指令，例如，然後啓用highcharts的useHTML：true屬性以及自定義格式化函數。 $ compile（）不會引發錯誤。獲取Highcharts工具提示以返回一個角度指令？

但是，當此代碼運行時，工具提示只是將Object.object顯示爲文本，而不是指令模板的內容。我錯過了什麼，或者這是不可能的？下面是我想知道如果這需要「附加」一些DOM元素上班的我們正在嘗試什麼的例子...

tooltip: { 
       useHTML: true, 
       formatter: function() {       

        return $compile("<pm-error-rate-tooltip ></<pm-error-rate-tooltip>")($scope); 


       } 
      }

，但如果是這樣，我不知道該元素是以工具提示命名的？

來源

2016-02-05 Ed Roper

分享小提琴伴侶？ – Siddharth

這是我正在嘗試做的一個基本的小提琴。該指令本身的作品，但作爲工具提示不http://jsfiddle.net/ue3x49tt/ –

您正在給格式化程序一個dom元素，它需要一個html字符串。將其轉換回html工作方式，但它似乎是實現您的目標的低效方式。
http://jsfiddle.net/ue3x49tt/3/

formatter: function() {     
    return $compile("<pm-error-rate-tooltip></pm-error-rate-tooltip>")($scope).html();     

}

來源

2016-02-05 23:18:10

非常感謝您的答案。你能否詳細說明爲什麼你認爲這是低效率的。實際上，我們將創建大約20個需要顯示的自定義工具提示，所以我認爲每個提示都有助於保持它的整潔，至少是代碼明智的做法...... –

@EdRoper我擔心的是您正在創建dom元素（即你不需要），然後將它們轉換回html字符串。 Angular不是我的東西，所以這可能是一個合理的開銷。 –

但如何做事件綁定？它只會返回html字符串！ –

我有一個約麻煩，我不能給一個paremeter的指令。 http://jsfiddle.net/tux82Lvw/

return $compile("<pm-error-rate-tooltip test='test'></pm-error-rate-tooltip>"

順便說一句，該指令範圍是確定的，唯一的麻煩是與模板編譯

//datacompliance 
angular.module('myapp').directive('pmErrorRateTooltip', function() { 
    return { 
    scope:{test:'='}, 
    link:function($scope){ 
    console.log($scope) 
    }, 
    restrict: 'E', 
    template: '<b>{{test}}</b>' 
    }; 
});

來源

2016-03-03 10:24:54 user2422856

我能得到這個帶有參數的工作。我從他們的答案中分出user2422856 jsfiddle以顯示http://jsfiddle.net/xhfgzfps/1/。

我不得不編譯指令，然後執行$ scope。$ digest（），最後使用.html（）返回標記。我無法弄清楚如何在不手動觸發摘要的情況下做到這一點。

$scope.test = "Dont work" 
var toolTip = $compile("<pm-error-rate-tooltip test='test'></pm-error-rate-tooltip>")($scope); 
$scope.$digest(); 
return toolTip.html();

來源

2016-07-08 17:41:35

獲取Highcharts工具提示以返回一個角度指令？

回答

相關問題