AngularJS:ng重复不'；无法检测范围的变化

我一直在阅读各种帖子、问题、答案和文档，但到目前为止还没有解决我的问题

我正在使用mbExtruder jQuery插件，为了将它集成到angular中，我为它创建了一个指令：

directive('mbExtruder', function($compile) {
            return {
                restrict : 'A',
                link : function(scope, element, attrs) {
                    var mbExtruderConfigurationAttrs = scope.$eval(attrs.mbExtruder);
                    mbExtruderConfigurationAttrs.onExtContentLoad = function() {
                        var templateElement = angular.element(angular.element(element.children()[0]).children()[0]);
                        var clonedElement = $compile(templateElement)(scope);                       
                        scope.$apply();
                        var contentElement = angular.element(angular.element(angular.element(element.children()[0]).children()[0]).children()[0]);
                        contentElement.replaceWith(clonedElement.html());
                    };
                    element.buildMbExtruder(mbExtruderConfigurationAttrs);
                    $.fn.changeLabel = function(text) {
                        $(this).find(".flapLabel").html(text);
                        $(this).find(".flapLabel").mbFlipText();
                    };

我提取容器div，编译它，应用scope并用转换后的div替换原始div

现在，我使用mbExtruder的功能从单独的HTML文件加载内容，如下所示：

<div>
<ul>    
    <li ng-repeat="property in properties">
        <span><img ng-src="../app/img/{{property.attributes['leadimage']}}"/></span>
        <a ng-click="openDetails(property)">{{property.attributtes['summary']}}</a>
    </li>
    <div ng-hide="properties.length">No data</div>
</ul>
</div>

你要进来了

contentElement.replaceWith(clonedElement.html());

请注意，这里实际上是用原始HTML字符串代码替换它。因此，Angular在代码中没有指令的概念。然而，我不明白为什么需要这样做。只需编译结果并将其附加到scope就可以了：

var templateElement = angular.element(angular.element(element.children()[0]).children()[0]);
$compile(templateElement)(scope);

以下是更新的工作版本：


$compile的文档并没有说太多，但是$compile返回一个函数，然后使用希望附加元素的作用域调用该函数（据我所知）。因此，您根本不需要存储对元素的引用，除非您以后想使用它。
您能创建一个plunker吗？如果
ng repeat
注释没有任何内容，这意味着
properties
必须为空（或不可编辑）。如果没有完整的示例，很难进行诊断，但听起来可能存在这样的问题：您正在更新指令的范围，而不是父控制器的范围。一个很好的调试工具是。启用后，可以检查每个元素的范围。这可能会让您看到设置了
properties
的位置和时间（如果有的话）。我将创建plunker示例。同时，为了回答这些问题并让整个案例更清楚一点，最初，属性是空的，但是，从ng repeat的角度来看，这是一种有效的情况——或者不是？这可能是实际的问题吗？一开始我有一个空数组？父作用域实际上已更新。指令的作用域实际上与父控制器作用域完全相同。我在指令中添加的这个watch实际上是在数据从服务器到达并且添加到属性时触发的，因此我将排除范围问题。在控制台中可以看到，在3秒钟（超时）后，指令内的watchCollection正确地拾取了对属性的更改，但它不应用于ng-repeat。谢谢。我没有尝试过不替换HTML的事件。用我从
$compile
中得到的东西来替换它是很自然的。而且，我已经阅读了好几次文档，只是为了确保我没有遗漏任何东西，但是，我显然确定了替换方法。
contentElement.replaceWith(clonedElement.html());

var templateElement = angular.element(angular.element(element.children()[0]).children()[0]);
$compile(templateElement)(scope);