angularjs - AngularJS 中的自定义属性设置器

Question

我有一个iframe，它的内容应该绑定到一个控制器函数。我试过

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

但不幸的是，它似乎不起作用。将内容写入 an 的正确方法iframe是访问iframeDOM 元素并调用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>