Question

我的JS中有for循环：

for (var i=0;i<2;i++) {
    $scope.widget = widgets[i];
    $scope.header = widgets[i].data.header;
    $scope.items = widgets[i].data.items;
    $scope.footer = widgets[i].data.footer;
    var widget = widgets[i];
    var div1 = '<div id="' + widget.id + '" class="' + widget.width +'" >';
    var div2 = '<div class="panel" style="background-color:' + widget.color +';color:white;">';
    var header = widget.body.headerTemplate;
    var panelStart =  '<div class="panel-collapse pull out">';
    var widgetBody = widget.body.itemTemplate;
    var widgetFooter = widget.body.footerTemplate;
    var panelEnd = '</div>';
    var div2End = '</div>';
    var div1End = '</div>';
    var widgetHTML = div1 + div2 + header + panelStart + widgetBody + widgetFooter + panelEnd + iv2End +iv1End;
    console.log(widgetHTML);

    var linkingFunction = $compile(widgetHTML);
    var elem = linkingFunction($scope);

    $(elem).appendTo("#widgetsContainer");
}

将一些HTML附加到div容器。在那个HTML中有数据绑定，如下所示：

<a href='{{header.redirectUri}}'>{{header.title}}</a>

当然，$ scope变量每次循环都会更改，最后所有范围变量都会使用最后一个值更新HTML。是否可以在绘制HTML后不更新HTML？

Answer 1

是 - 在角度1.3.x中引入 - 一次性绑定

<a href='{{::header.redirectUri}}'>{{::header.title}}</a>

对于ng-repeat执行此操作：

'ng-repeat="item in ::items"'

在Exploring Angular 1.3 - One-time bindings

了解详情

Answer 2

使用单向绑定，如果使用Angular 1.3.x，则使用

<a href='{{::header.redirectUri}}'>{{::header.title}}</a>

或使用bind-once

当角度$ scope更改时，不要更新HTML

2 个答案: