Question

我有iframe，它的内容应绑定到控制器功能。我试过了

<iframe ng-bind-html-unsafe="selectedMessage.content()"></iframe>

但遗憾的是它似乎不起作用。将内容写入iframe的正确方法是访问iframe DOM元素并调用ifrmElem.contentDocument.write(s)。

我该如何做到这一点？

Answer 1

您可以通过在属性上设置观察程序，然后在需要时手动更新iframe来实现此目的。

下面的示例使用跨浏览器iframe内容选择。

参见jsFiddle：http://jsfiddle.net/uyLNY/2/

$scope.$watch('data.content', function(oldValue, newValue) {
    var ifrm = $element.find('iframe')[0];
    ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;       
    ifrm.document.open();
    ifrm.document.write(newValue);
    ifrm.document.close();

});

但值得注意的是，如果你要撰写大量内容，我不确定这一点的表现。

Answer 2

这是一个plnkr：http://plnkr.co/edit/LG7p1AG7yhVKyLXgMX4Q?p=preview

的Javascript

  $scope.content= "";

  $scope.fillFrame = function(id) {
    document.getElementById(id).contentDocument.write($scope.content);  
  };

HTML

 <strong>Enter some html</strong>
    <br/>
    <textarea ng-model="content"></textarea>
    <button ng-click="fillFrame('frame')">Fill iFrame</button>

AngularJS中的自定义属性设置器

2 个答案: