获取Highcharts工具提示以返回一个角度指令？ [英] Getting Highcharts tooltip to return an angular directive?

问题描述

我们正在尝试为我们的Highcharts图创建一些复杂的工具提示，该图会显示一些动态数据，但不会显示在图中，因此我认为最好的办法是为所有格式创建一个角度指令等等，然后启用highcharts的useHTML：true属性以及自定义的格式化函数。 $ compile（）不会引发错误。然而，当这段代码运行时，tooltip只是将Object.object显示为文本，而不是内容该指令的模板。我错过了什么，或者这是不可能的？以下是我们正在尝试的一个示例...

 工具提示：{
 useHTML：true，
 formatter：function（）{
 
 return $ compile（< pm-error-rate-tooltip>< /< pm-error-rate-tooltip>） ）; 
 
 
} 
} 
  

我是想知道这是否需要附加到某个DOM元素上，但如果是这样，我不确定该元素是为该工具提示命名的？

解决方案

你给格式化程序一个dom元素，它需要一个html字符串。将它转换回html工程，但它似乎是一种低效率的方式来实现您的目标。

http://jsfiddle.net/ue3x49tt/3/

  formatter：function（）{
 return $ compile（< pm-error-rate-tooltip>< / pm-error-rate-tooltip>）（$ scope）.html（）; 
 
} 
  

We are trying to create some complex tooltips for our Highcharts graph, that will be showing some dynamic data thats in the app but not displayed by the graph, so I figured the best bet was to create an angular directive for all the formatting and such, and then enable the useHTML : true attribute of highcharts along with a custom formatter function. The $compile() doesn't throw an error..

However when this code runs, the tooltip just shows Object.object as the text, and not the content of the directive's template. Am I missing something, or is this not going to be possible? Below is an example of what we're trying...

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

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


                }
            }

I'm wondering if this needs to be 'appended' to some DOM element to work, but if so I'm not sure what the element is named for the tooltip?

解决方案

You are giving the formatter a dom element, and it wants an html string. Converting it back to html works, but it seems like an inefficient way to accomplish your goal.
http://jsfiddle.net/ue3x49tt/3/

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

}

这篇关于获取Highcharts工具提示以返回一个角度指令？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！