0

编辑：这里的jsFiddle示例。

我有一个ngRepeat产生包含iframes.

div(ng-repeat='element in elements')
    ng-switch(on="element.type") 
        a-directive(ng-switch-when="something")
        another-directive(ng-switch-when="somethingElse")

现在，在指令中，我在某些事件之后将内容加载到 iframe 中，方法是：

$iframe[0].contentWindow.d_contents = "html"
$iframe[0].src = 'javascript:window["d_contents"]'

一切都很好。

当我从模型中（在控制器中）删除其中一个元素时，例如：

elements.remove(object) //using sugarjs, that's not the issue, same behaviour with splice

UI 得到相应更新，即元素消失。

问题

这按预期工作：

elements.push(ele1)
elements.push(ele2)

.. init iframes inside ele1 and ele2 with content ..

elements.remove(ele2)

结果：ele2从 UI 中消失，ele1仍然存在加载 iframe

这不会：

elements.push(ele1)
elements.push(ele2)

.. init iframes inside ele1 and ele2 with content ..

elements.remove(ele1)

结果：ele1从 UI 中消失，ele2仍然存在 iframe，但 iframe 内容恢复为空，iframe.load()并被触发。

这里发生了什么？为什么我的 iframe 会被重置？

4

1 回答 1

0

您需要在 load() 中添加加载逻辑，以便在 DOM 更改时重新加载内容。

var linkfn = function (scope, element, attrs) {
    init(function () {
        var $iframe = element.find("iframe")

        var refresh = function () {
            var doc = $iframe[0].contentWindow.document;
            doc.open();
            doc.write(scope.ele.source);
            doc.close();
        }

        $iframe.load(function () {
            console.log(scope.ele.id + ": loaded ");

            //refreshing
            refresh();
        });

        //initial loading
        refresh()
    })
}

您需要在doc.write()这种情况下使用，否则会出现递归循环错误。

DEMO

于 2013-08-26T19:07:10.537 回答