在Angular2的router-outlet中加载外部URL

Loading External URL in Angular2 router-outlet

本文关键字：加载 外部 URL router-outlet Angular2      更新时间：2023-09-26

我正在使用Angular2开发一个应用程序。我有一个模板如下的组件:

<div>
  <router-outlet></router-outlet>
</div>

有人可以帮助我如何加载外部URL 'www.example.com'在这个div?

通过使用路由配置创建一个组件来在<ng-outlet>中渲染。然后你的组件模板内部应该有一个指向外部站点的<iframe>。

import {Component, OnInit} from '@angular/core';
@Component({
    selector: 'app-external-page',
    templateUrl: './external-page.component.html',
    styleUrls: ['./external-page.component.css']
})
export class ExternalPageComponent implements OnInit {
    title = 'app works!';
    constructor(private _stellarService: StellarService) {
    }
    ngOnInit(): void {
    }
}
那么你的组件模板应该看起来像 
<div>
    <iframe src="yourexternalpage url"></iframe>
</div>

有了上面这样的代码，剩下的步骤就是在你的路由中配置一个路由

你得到答案了吗?

您可以拥有这里提到的组件。导入并添加到你的NgModule中;然后将其导入到您想要的页面中，并使用选择器代替<router-outlet>。

相关文章：