javascript - 在 Angular2 路由器导出中加载外部 URL

Question

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

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

有人可以帮助我如何在此 div 中加载外部 URL“www.example.com”吗？

Answer 1

只需创建一个要在内部渲染的组件 <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>

有了上面的代码，只剩下在路由中配置路由的步骤了。