OpenLayers3スタイル関数のAngularクラスプロパティを使用する

Question

私は、OpenLayers3を使ってサンドボックスゲームWurm Online用の島のマップをレンダリングするために作成したAngular2/4アプリを持っています。それは、私が純粋なJSから作成した古いバージョンのkludgeyを置き換えて、きれいに動作します。

現在のデモ：http://www.wurmonlinemaps.com/maps/xanadubeta

コードレポ：https://github.com/WefNET/wurmonlinemaps-ng

私はエンドユーザーに画面上にレンダリングされた特定の機能の色をカスタマイズする機能を提供したいと考えています。最終的には、localStorageのコンセプトを使用してユーザーの設定を保存したいと考えています。

私が期待していたことはうまくいかず、ベクターレイヤのスタイルファンクションのスタイルプロパティを角度クラスのプロパティ値に設定しました。

基本的な考え方

この擬似コードの例では、「deedColor」角度クラスのプロパティは、その後、私はスタイルの関数内でそれを消費しようとすると、値に設定されている：

export class AppComponent { 
    deedColor: string = "rgba(255,0,0,0.4)"; 

    var deedStyleFunction = function (feature, resolution) { 
     return [ 
     new ol.style.Style({ 
      image: new ol.style.RegularShape({ 
       points: 4, 
       radius: 11/resolution, 
       angle: Math.PI/4, 
       fill: new ol.style.Fill({ 
        color: this.deedColor 
      }), 
     }) 
     ] 
    } 

    // hundreds of other lines 
} 

悲しいことに、スタイル機能は角度クラスのプロパティを把握することはできません。いくつかの実験をした後

ERROR TypeError: Cannot read property 'deedColor' of undefined 

、それは私らしいですOLスタイル関数内からAngularオブジェクトにアクセスすることはできません。

アイデア？

Answer 1

スコープの問題がある可能性があります - ngのオブジェクトへのあなたの結合機能を試してみてください。

deedStyleFunction = function(feature, resolution) { 

}.bind(this);