Javascript 使用$compiled时，在循环中重复重复iten

我正在尝试将一些内容加载到bootstrap的popover中。该内容是隐藏div的html元素的集合，其中包括在对象列表下迭代的ng repeat。好的，它起作用了。但是ng点击在popover中不起作用。为了解决这个问题，根据我在stackoverflow中读到的内容，我在将内容设置为popover时使用了$compile选项。是的，它也起作用。但是，当我这样做时，对象列表显示在其中。有人能告诉我怎么了吗

角度模块（“应用程序”，[]） .controller（“progressBarCtrl”，函数（$scope、$timeout、$compile）{ $scope.value=90； $scope.cursos=[ {“nome”：“Medicina”，“percentual”：“20”}， {“nome”：“Ciência da computaèo”，“percentual”：“90”} ]; $scope.showPopover=函数（）{ $（#main”）.popover（“show”）； } $timeout（函数（）{ $scope.$apply（函数（）{ $（“#main”）.popover({ 容器：'主体'， 是的， 内容：功能（）{ 返回$compile（$（“#popper content”）.html（））（$scope）； } }); }); }); $scope.showarter=函数（）{ 警惕（）； }; });

Progresso geral：
{{value}}}%
{{curso.nome}}：
{{curso.percentual}}}%
点击我

这个问题的答案出人意料地复杂。在幕后，你的重复被执行了两次。当应用程序加载时，因为它位于应用了角度控制器的元素（主体）内的DIV中

要使这项工作正常，您不仅需要使用CSS“隐藏”模板内容，还需要对其进行隐藏。您可以通过放置模板和外部文件（到目前为止最常见的东西和实际应用程序）或使用script标记来实现这一点

另外，在示例代码中，您在$timeout内调用了scope apply；这不是必需的，$timeout为您调用它

请看下面的plunker，我认为它现在符合您的要求

最重要的代码：

    $timeout(function() {   
        $("#main").popover({
            container: 'body',
            html: true,
            content: function () {
                return $compile($templateCache.get('popper-content'))($scope);                          
            }
        });
    });

---

谢谢@Kyle Cords。你救了我的命。