根據該列對表進行排序時，反應表列標題中的工具提示停止工作

Question

我正在使用反應性表包創建表，並在向標題添加工具提示時遇到問題。 基本上，我試圖以這種方式在列標題中顯示一個工具提示 ，即當用戶將光標置於其上時，會彈出有關該列的一些信息。 這是我要做的工作：

{ key: 'example',
  label: function () { 
    return new Spacebars.SafeString('<span data-toggle="tooltip" title="This is some example text for the tooltip!">Example Title </span>'); 
  }
},

初始化工具提示：

Template.myTemplate.onRendered(function() {
    // Tooltip
    $("[data-toggle=tooltip]").tooltip();
});

當我第一次刷新頁面時，它完全可以正常工作，並且當我將光標放在標題上時，將顯示工具提示。 我遇到的問題是，當我單擊該標題以基於該列對表行進行排序時，工具提示停止工作。 我可以單擊任何其他列標題並根據這些列標題對表行進行排序，它仍然可以工作，但是當我使用工具提示單擊該行時，除非重新刷新頁面，否則它將導致工具提示不再起作用。

關於為什么會發生或如何解決的任何想法？

Answer 1

我通過為標簽使用模板並將工具提示放在其中而不是使用函數來解決了此問題。 然后，我將工具提示初始化JS放在該template.onRendered內部。

例：

.html

<template name="myColumnLabel">
    <span data-toggle="tooltip" title="This is some example text for the tooltip!">Example Title</span>
</template>

.js

Template.myColumnLabel.onRendered(function() {
    // Tooltip
    $("[data-toggle=tooltip]").tooltip();
});

.js（反應性表格）

{ key: 'example', label: Template.myColumnLabel }