2016-06-15 7 views
1

これは、Angular2によってロードされたMapコンポーネントの後に呼び出される必要があるJSコードです。コードはコンポーネントテンプレートで定義されています。私はonNgInit方法でコンポーネントからgetLocation()関数を呼び出すにはどうすればよいAngular2からコンポーネントテンプレートで定義されたJS関数を呼び出す

<script> 
    var x = document.getElementById("demo"); 
    function getLocation() { 
     if (navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(showPosition,showError); 
     } else { 
      x.innerHTML = "Geolocation is not supported by this browser."; 
     } 
    } 

    function showPosition(position) { 
     x.innerHTML = "Latitude: " + position.coords.latitude + 
     "<br>Longitude: " + position.coords.longitude; 
    } 

    function showError(error) { 
     switch(error.code) { 
      case error.PERMISSION_DENIED: 
       x.innerHTML = "User denied the request for Geolocation." 
       break; 
      case error.POSITION_UNAVAILABLE: 
       x.innerHTML = "Location information is unavailable." 
       break; 
      case error.TIMEOUT: 
       x.innerHTML = "The request to get user location timed out." 
       break; 
      case error.UNKNOWN_ERROR: 
       x.innerHTML = "An unknown error occurred." 
       break;   
     } 
    } 
</script> 

? (可能な場合は、これは良い方法で設計することができますか?)受け入れ答えと他から

最終的な解決策SOの答え:

Working Code In Plunker - integrating Geolocation, angular2-google-maps and Angular2 (RC1)

+0

なぜあなたのコードを角度の中に移動しないのですか? –

+0

コードはHTMLの 'geolocation' APIを使用しています...コンポーネント内でどのように動かせるのかわかりません... –

+0

私は何が問題なのか分かりません;-)。あなたは外で行うことができる角度の中のすべてを行うことができます。 Angularが読み込みを完了する前にタイミングの問題がある場合を除いて、 –

答えて

1

はスクリプト

window.myGetLocation = getLocation; 
の最後に追加します。

角度成分:

ngOnInit() { 
    console.log(window.myGetLocation()); 
} 

あなたはtypescriptですスクリプトファイルに

declare var navigator; 

を追加する場合は、あなたのAngular2コンポーネント内navigator.geolocation...を使用することができます。

Plunker example

関連する問題