IFrame（インラインフレーム）でアイテムをクリックすると、特定のURLにルーティングする必要があります

Question

私のAngle 2アプリケーションの1つのコンポーネントでiフレームを使用しています。

Component.ts

import { Component, OnInit } from '@angular/core'; 
import { SafeResourceUrl,DomSanitizer,} from '@angular/platform-browser'; 

@Component({ 
    selector: 'sample comp', 
    templateUrl: './sample-comp.component.html', 
    styleUrls: ['./sample-comp.component.css'] 
}) 
export class sampleComp implements OnInit { 
    //DECLARATION 
    webURL:SafeResourceUrl; 
    constructor() { 

    } 

    ngOnInit() { 
    } 
public onSelectid(){ 
    console.log('Router selected'); 

} 
} 
let greeter = new CampaignOrderComponent(); 
module FooModule { 
    export var FooInstance = new CampaignOrderComponent(); 
} 

Component.html

​​3210

Iフレーム上のクリックイベントをトリガしながら、私は別のコンポーネントにルーティングする必要があります。（私はすでに持っていましたルートコンポーネントのルーティングファイルで指定されています）。

今Iフレームアプリ（MVCアプリ）の内側に、私は

parrent.showme() 

クリック機能をトリガし、（index.htmlをとリンク）の角2アプリのルートフォルダにindex.jsを追加しました

index.js

function showme() 
    { 
     alert('function called'); 
     FooModule.FooInstance.onSelectid(); 

    } 

は、今私は、角2アプリpに警告を表示することができますiフレームアプリ内をクリックすると

ターゲットは、角度2アプリのルートを変更するshowme（）の機能を変更することです。

どうすればいいですか？

私はそれを解決するためにいくつかの方法を試していましたが、残念ながら私は得ることができません。

Answer 1

は、すべてのコンポーネントがこのコードを使用する前にインポートする必要があるか、あなたのフレームにIDを追加して、ハイiframe要素

<iframe id="iframe_id" src="https://sampleurl" style="margin-top:-10px" frameborder="1" 
     webkitallowfullscreen mozallowfullscreen allowfullscreen> 
    </iframe> 

constructor(private _router: Router){ 
    } 
    ngAfterViewInit(){ 
    document.getElementById("iframe_id").contentWindow.document.body.onclick = 
    () => { 
     this._router.navigate(['/yourChildRoute']); 
     } 


    }