本文介绍了如何在ionic2中加载外部html页面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在创建一个Ionic2应用程序。我有一个组件,我想将外部templateUrl加载到ex(http:www.example.com/test-view.html)。
I am creating an Ionic2 app. I have a component that I would like to load an external templateUrl into e.x (http:www.example.com/test-view.html).
我该如何去关于将html加载到@Component中的templateUrl变量中?
How do I go about loading that html into the templateUrl variable in @Component?
这是我到目前为止所做的。
Here's what I have so far.
import { Component, DynamicComponentLoader, ViewContainerRef,
ViewChild } from '@angular/core';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { Http, Headers, RequestOptions } from '@angular/http';
@Component({
//templateUrl: 'build/pages/hello-ionic/hello-ionic.html'
template: `<div [innerHTML]="myVal"></div>`,
selector: 'HelloIonicPage'
})
export class HelloIonicPage {
myVal: any;
viewLink: any;
viewHtml: any;
constructor(private http: Http) {
let headers = new Headers({ 'Content-Type': 'text/html' });
let options = new RequestOptions({ headers: headers });
this.viewHtml = this.http.get('http://example.net//test-view1.html');
this.myVal = this.viewLink
console.log(this.myVal);
}
}
推荐答案
你可以这样做:
this.http
.get('http://example.net//test-view1.html')
.map(response => response.text())
.subscribe(html => myVal = html);
请注意,html将被清理,所以如果你需要一些奇特的东西,你将不得不使用。不要忘记文档中的安全风险标志(;
Note that html will be sanitized, so if you need something fancy you'll have to use DomSanitizationService. Don't forget about it's Security Risk flag in the docs (;
这篇关于如何在ionic2中加载外部html页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!