[HELP] Show Iframe in ionic

Ionic Framework ionic-v3
1

In ionic 1 . I showed iframe by this way. I add this code below.
.config(function ($sceProvider){
$sceProvider.enabled(false);

})

And It’s Ok.

But in ionic 2 . May be this way cannot.

Help me pls

Thank so much.

2

I use that for youtube:

.html

<div class="video-container">
    <iframe [src]="updateVideoUrl(video.src)" frameborder="0" allowfullscreen></iframe>
</div>

.ts

import {SafeResourceUrl, DomSanitizationService} from '@angular/platform-browser';

constructor(public navCtrl: NavController, public sanitizer: DomSanitizationService) {

}

updateVideoUrl(id: string) {
        // Appending an ID to a YouTube URL is safe.
        // Always make sure to construct SafeValue objects as
        // close as possible to the input data, so
        // that it's easier to check if the value is safe.
        let dangerousVideoUrl = 'https://www.youtube.com/embed/' + id + '?rel=0&showinfo=0';
        return this.sanitizer.bypassSecurityTrustResourceUrl(dangerousVideoUrl);
}
5 Likes
Open url inside the application as a component with SafariViewController?
3

i found my mistake. Maybe my content is large string. And i display by [innerHTML] = {{content}} . Some content is stripped, contains iframe tags . How can i do another way? Some one help me.

4

There isn’t a way to do this. Angular will prevent the iframe from being loaded for security reasons, so you won’t be able to show it.

5

@mhartington How would be the proper way to show video’s in a page?

6

so how we can handle html data which contains iframe?

7

Best answer. Worked for me.

8

DomSanitizationService is changed to DomSanitizer

1 Like