Displaying PDF in iframe in native

I have built part of my app to display local PDFs from a pdf folder under assets in an iframe. It works fine in ionic lab, but will it work with ios and android native?

Is there anything special I need to do?


    <ion-buttons slot="start">
      <ion-back-button defaultHref="/"></ion-back-button>

  <iframe name= "eventsPage" [src]="this.mysite" width="100%" height="95%">


import { Component, OnInit } from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {GetProtocolsService} from '../../services/get-protocols.service';
import { DomSanitizer } from '@angular/platform-browser';

  selector: 'app-protocol-details',
  templateUrl: './protocol-details.page.html',
  styleUrls: ['./protocol-details.page.scss'],
export class ProtocolDetailsPage implements OnInit {

  information = null;
  protocols = null;

  mysite = null;

  constructor(private activatedRoute: ActivatedRoute, private protocolService: GetProtocolsService, private router: Router,
              private sanitizer: DomSanitizer) { }

  ngOnInit() {
    // Get the ID that was passed with the URL
    let id = this.activatedRoute.snapshot.paramMap.get('id');


    this.protocolService.getProtocols().subscribe(result => {
      console.log('getHospitals1 executed')
      this.protocols = result;
      console.log('result', result);
      this.information = this.filterArr(id)[0];
      console.log('information', this.information);
      this.mysite = this.sanitizer.bypassSecurityTrustResourceUrl('../../../assets/pdf/' + this.information.pdf.toString());

  filterArr(search) {
    // Get the real array forst of all
    let arr = this.protocols;

    return arr.filter(oneObj => oneObj.id.indexOf(search) >= 0);


what are you seeing in android or ios ?

When I move the app to Android and go to the page with the iframe PDF, I just get a blank screen.

Have you found a solution for this yet?

I ended up using Cordova plugins.