在 ion-content 中加载外部 url答案

【问题标题】：Load external url inside ion-content在 ion-content 中加载外部 url
【发布时间】：2018-01-18 20:48:47
【问题描述】：

我正在使用 ionic 1，我想在 ion-content 中加载一个外部 url（就像 Messenger 应用一样）我已经尝试过cordova-plugin-inappbrowser，但它会将网址加载到新页面中。

这是我使用的代码：

cordova.InAppBrowser.open(item.url, '_self');

我也尝试在 iframe 中嵌入 url，但它拒绝显示，因为 url 不是我的。

这是我写的<iframe src="{{item.url | trustUrl}}"></iframe>

任何帮助将不胜感激:)

【问题讨论】：

想在应用程序中也完成该功能吗？
@Anuj 我发现了这个科尔多瓦插件ThemeableBrowser 它可以满足我们的需求，但它有点难看，我不知道我是否可以覆盖它的风格。希望你觉得它有用。
嗨哥们，谢谢你的味精。我是通过 iframe (in html) 和 DomSanitizer (npm for ts) 完成的，现在它工作正常。
那我应该找个时间试试
检查我的回答，如果有帮助，请投票并关闭您的问题，谢谢

标签： javascript cordova ionic-framework

【解决方案1】：

我用 i frame 和 domsanitizer 试过了我的 Html 是

<ion-header>
  <ion-navbar color="danger">
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>Payments Detail</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <iframe width="100%" height="100%" [src]="myurl" frameborder="0" allowfullscreen></iframe>
</ion-content>

我的 ts 是

import { Component } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import {DATA} from "../../app/config";
import {NavParams, ToastController} from "ionic-angular";
import {Network} from "@ionic-native/network";


@Component({
  templateUrl: 'paymentDetail.html'
})
export class PaymentDetail {
    myurl:any="";
  constructor(private network: Network,private toastCtrl: ToastController,private sanitizer: DomSanitizer,public navParams: NavParams) {

  }
    ngOnInit() {
        if(this.network.type !="none"){
        console.log(this.navParams.get("payment"));
        this.myurl=this.sanitizer.bypassSecurityTrustResourceUrl(DATA["API_BASE_URL2"]+"userpage/RedirectNow?id="+this.navParams.get("payment"));
        }else {
            let toast = this.toastCtrl.create({
                message: "check your internet connection before process",
                duration: 2000,
                position: 'middle'
            });
            toast.present();
        }
  }

}

试试这个。

【讨论】：

在 iframe 中加载的网站不会滚动