Geek Answers Handbook

Angular 2 srcdoc polyfill not working

I am using Angular 2 with angular-cli and I want to add srcdoc polyfill to support Microsoft Edge. So:

I added to package.json https://github.com/jugglinmike/srcdoc-polyfill

I imported import 'srcdoc-polyfill/srcdoc-polyfill.min'; at polyfills.ts.

I used it like:

  <iframe class="ticket-frame" [srcdoc]="ticket.html | htmlSafe" tlIframeAutoHeight> </iframe>

Incidentally, if you ask me about the IframeAutoHeight directive, here is the code:

 @Directive({ selector: '[tlIframeAutoHeight]' }) export class IframeAutoHeightDirective { constructor(element: ElementRef, renderer: Renderer) { renderer.listen(element.nativeElement, 'load', () => { renderer.setElementStyle( element.nativeElement, 'height', element.nativeElement.contentWindow.document.body.clientHeight + 'px' ); }); } }

Microsoft Edge 35 ignores the srcdoc property, any ideas on what the problem is?

I also accept workarounds.

+7
microsoft-edge angular polyfills
source share
1 answer

For some reason, the attribute does not work:

 <iframe #frame></iframe> import * as srcDoc from 'srcdoc-polyfill'; @ViewChild('frame') public iframe:ElementRef; srcDoc.set(this.iframe.nativeElement, "<html><body>test</body></html>");
+4
source share

More articles:


All Articles