發表於 程式分享

ionic 2 動態載入iframe src

1.最先遇到的問題是caused by: unsafe value used in a resource URL context,其解法為加上DomSanitizer 解析 url
cart.ts檔

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, Loading, LoadingController } from 'ionic-angular';
import { DomSanitizer } from '@angular/platform-browser';
import { User } from '../../providers/providers';

@IonicPage()
@Component({
  selector: 'page-cart',
  templateUrl: 'cart.html',
})
export class CartPage {
    private webUrl : any;
    loading: Loading;

    constructor(public navCtrl: NavController, public navParams: NavParams,
        private user: User, private sanitizer: DomSanitizer,
        public loadingCtrl: LoadingController) {        
        this.webUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.user._user.shopItem.WebUrl);
    }

    ionViewWillEnter(): void {
        this.loading = this.loadingCtrl.create({
            content: 'Please wait...'
        });

        this.loading.present();
    }

    handleIFrameLoadEvent(): void {
        this.loading.dismiss();
    }
}

html檔:


2.而後遇到page需load兩次才能正常顯示畫面,查了許久,發現因是放在 <ion-tab> 的第二個,但其原本預設的root 非 CartPage,調整後就好了

發表留言