Question

我有一个像这样的物体 import pandas as pd import matplotlib.pyplot as plt import seaborn as sns data = {'Annualized Return': [0.100279, 0.052186, 0.066412, 0.037828, 0.083212, 0.06448999999999999, 0.07459500000000001, 0.048052, 0.053672000000000004, 0.05488099999999999], 'Annualized Volatility': [0.018287, 0.019462, 0.021039, 0.030206999999999998, 0.016781, 0.019199, 0.015279, 0.015284, 0.013397999999999998, 0.018141], 'Weighting Method': ['Equal Weights', 'Equal Weights', 'Equal Weights', 'Equal Weights', 'Equal Weights', 'ERC', 'ERC', 'ERC', 'ERC', 'ERC']} df = pd.DataFrame(data) # display df.head() Annualized Return Annualized Volatility Weighting Method 0 0.100279 0.018287 Equal Weights 1 0.052186 0.019462 Equal Weights 2 0.066412 0.021039 Equal Weights 3 0.037828 0.030207 Equal Weights 4 0.083212 0.016781 Equal Weights # convert dataframe from wide to long dfl = pd.melt(df, id_vars='Weighting Method', value_vars=['Annualized Return', 'Annualized Volatility']) # display dfl.head() Weighting Method variable value 0 Equal Weights Annualized Return 0.100279 1 Equal Weights Annualized Return 0.052186 2 Equal Weights Annualized Return 0.066412 3 Equal Weights Annualized Return 0.037828 4 Equal Weights Annualized Return 0.083212 # plot dfl sns.boxplot(x='Weighting Method', y='value', data=dfl, showfliers=False, color='tomato', hue='variable') plt.legend(bbox_to_anchor=(1.04,0.5), loc="center left", borderaxespad=0)

在角组件html中，使用我这样编写的引导程序

var obj = {"test price type ty dynamic ": 10, test: 7, pricetype1u: 0, Price type 3: 0, Price type 2: 0}

工具提示显示为（对象）如下：

<button type="button" 
        icon="file-excel" 
        data-toggle="tooltip" 
        data-placement="top"
        title="{{obj}}">

        <span class="k-icon k-i-info"></span>
</button>

我的要求是显示这样的工具提示

{
  "test price type ty dynamic ": 10, 
   "test": 7, 
   "pricetype1u": 0, 
   "Price type 3": 0, 
   "Price type 2": 0  
}

请帮助我如何获取此所需格式

Answer 1

如果所有对象工具提示均具有此要求，则应考虑使用管道。将下面的实现复制到管道中应该可以。

如果只需要一次使用此格式，则可以编写一个简单的函数来处理它：

function convertObjTooltip(obj: any) {
    const results = [];
    Object.keys(obj).reduce((sum, key) => {
        sum.push(`${key}: ${obj[key]}`);
        return sum;
    }, results);
    return results.join('\n');
}

我没有删除第一条更改行，您可以自己处理。

在模板中调用它：

<button type="button" 
    icon="file-excel" 
    data-toggle="tooltip" 
    data-placement="top"
    title="{{convertObjTooltip(obj)}}">

如何在角度组件中使用引导语法将对象显示为工具提示

1 个答案: