以角度2

时间:2016-04-09 07:21:23

标签: iframe angular

我想在 angular 2 typescript 中更改iframe中元素的属性,类似于javascript代码

document.getElementById('iframeId').window.document.getElementById('home-grid').style.visibility = "hidden";

My Angular打字稿代码:

var iframe   = document.getElementById('iframeId');
var insideDoc = iframe.contentDocument || iframe.contentWindow.document;

编译代码时出错:

stream.js:74
      throw er; // Unhandled stream error in pipe.
      ^
 Error: ./angularapp/web/component/mainPage/mainPage.ts
←[37m(←[39m←[36m35←[39m,←[36m32←[39m): ←[31merror TS2339: Property 'contentDocument' does not exist on type 'HTMLElement'.←[39m./angularapp/web/component/mainPage/mainPage.ts
←[37m(←[39m←[36m35←[39m,←[36m58←[39m): ←[31merror TS2339: Property 'contentWindow' does not exist on type 'HTMLElement'.←[39m

有没有办法在角度2中实现这个目标?请帮忙

1 个答案:

答案 0 :(得分:11)

@Component({
  selector: 'my-app',
  template:`
    <h1>Selecting Number</h1>
    <iframe id="iframeId" src="iframe.html" (load)="onLoad()"></iframe>
  `,
})
export class App {
  onLoad()  {
    var iframe   = document.getElementById('iframeId');
    var iWindow = iframe.contentWindow
    var doc = iframe.contentDocument || iframe.contentWindow.document;
    console.debug(doc);
    console.log(doc.getElementById('foo').innerText);
  }
}

Plunker demo