Question

在我的应用程序中，我通过$(element).contents()在某个时刻保存了一个非常大的HTML块状态（如果需要，我可以使用$(element).html()）。如果它包含复杂的指令信息，如何将该块转换回角度？重点是避免重建ng重复。但是如果没有编译它，我将失去其内部角度的所有功能。以下是HTML字符串看起来相似的一个小例子：

<div ng-controller='fruits'>
    <div class="dtable">
        <!-- ngRepeat: fruit in fruitCollection track by fruit.id -->
        <div ng-repeat="fruit in fruitCollection track by fruit.id" class="ng-scope drow selected" ng-class="fruit.selected && 'selected'">
            <div class="idx ng-scope dinline">1</div>
            <div class="name ng-scope dinline hilight">Apple</div>
            <div class="info ng-scope dinline">Red</div>
        </div>
        <!-- end ngRepeat: fruit in fruitCollection track by fruit.id -->
        <!-- ngRepeat: fruit in fruitCollection track by fruit.id -->
        <div ng-repeat="fruit in fruitCollection track by fruit.id" class="ng-scope drow" ng-class="fruit.selected && 'selected'">
            <div class="idx ng-scope dinline">2</div>
            <div class="name ng-scope dinline">Orange</div>
            <div class="info ng-scope dinline">Orange</div>
        </div>
        <!-- end ngRepeat: fruit in fruitCollection track by fruit.id -->
    </div>
    <h3>Filters</h3>
    <div class="controls dtablev">
    <!-- ngRepeat: filter in filterCollection -->
        <div class="ng-scope checked" ng-click="toggleSelection(filter)" ng-class="filter.checked && 'checked'">Red</div>
    <!-- end ngRepeat: filter in filterCollection -->
    <!-- ngRepeat: filter in filterCollection -->
        <div class="ng-scope" ng-click="toggleSelection(filter)" ng-class="filter.checked && 'checked'">Orange</div>
    <!-- end ngRepeat: filter in filterCollection -->
    </div>
</div>

简单地重新插入HTML看起来很棒，但是你不能点击任何东西。我希望$compile有一些小秘密可以处理这个问题。

Answer 1

将HTML重新添加到页面后，您应该在根元素上使用$compile服务。

$compile(element)($scope);

恢复已保存的Angular HTML

1 个答案: