Angularjs 角度ui引导工具提示未在ng repeat中显示（节点webkit应用程序）

我是angular.js和node webkit的新手，我正在努力使引导工具提示在通过ng repeat动态加载的内容中工作

首先，我尝试使用标准引导并执行了以下操作：

这不起作用（但第一个表行中“正常”定义的工具提示起作用）

然后，我尝试使用angular ui引导并执行了以下操作（认为angular库将侦听新的dom元素应该是“自动的”）：

---

但也没有运气。有人能给我指出正确的方向吗？我在Stackoverflow上看到了一些关于这个的讨论，但没有一个真正解决了我的问题。我听过一些对$compile的模糊引用，但不知道如何实现它。

我认为您的做法是错误的，您不应该在动态加载的内容中加载html，您应该只加载将放入html模板中的数据，然后您可以这样做：

{{foo.content}

我认为您的做法是错误的，您不应该在动态加载的内容中加载html，您应该加载将放入html模板的数据，然后您可以这样做：

{{foo.content}

我为此编写了一个简单的指令（支持ng repeat）：

例如：

其思想是在每次加载“tooltip loader”元素时使用常规选项调用tooltip（）：

然后，您可以在视图中调用它：

  <div ng-repeat="_type in types" data-toggle="tooltip" data-original-title="{{_type.name}}" style="border: 1px solid blue; width: 50px;" tooltip-loader>
    {{_type.name}}
  </div>

  <div data-toggle="tooltip" data-original-title="Zoom reset" style="border: 1px solid blue; width: 100px;" tooltip-loader>
    <span>Zoom reset</span>
  </div>

---

我为此编写了一个简单的指令（支持ng repeat）：

例如：

其思想是在每次加载“tooltip loader”元素时使用常规选项调用tooltip（）：

然后，您可以在视图中调用它：

  <div ng-repeat="_type in types" data-toggle="tooltip" data-original-title="{{_type.name}}" style="border: 1px solid blue; width: 50px;" tooltip-loader>
    {{_type.name}}
  </div>

  <div data-toggle="tooltip" data-original-title="Zoom reset" style="border: 1px solid blue; width: 100px;" tooltip-loader>
    <span>Zoom reset</span>
  </div>

angular.module('myApp', ['ui.bootstrap']).directive('tooltipLoader', function() {
    return function(scope, element, attrs) {

      element.tooltip({
        trigger:"hover",
        placement: "top",
        delay: {show: 1000, hide: 0}
      });

    };
  });

  <div ng-repeat="_type in types" data-toggle="tooltip" data-original-title="{{_type.name}}" style="border: 1px solid blue; width: 50px;" tooltip-loader>
    {{_type.name}}
  </div>

  <div data-toggle="tooltip" data-original-title="Zoom reset" style="border: 1px solid blue; width: 100px;" tooltip-loader>
    <span>Zoom reset</span>
  </div>

angular.module('myApp', ['ui.bootstrap']).controller('MainCtrl', ['$scope', function ($scope) {
    $scope.types = [{
        name: 'note',
        iconName: 'icon-text_tool_big'
      }, {
        name: 'rect',
        iconName: 'icon-square_tool_big'
      }, {
        name: 'circle',
        iconName: 'icon-ellipse_tool_big'
      }, {
        name: 'arrow',
        iconName: 'icon-arrow_tool'
      },{
        name: 'path',
        iconName: 'icon-free_line_tool'
      }
    ];

}]);