2017-05-01 5 views
-1

モジュールバンドラーとしてSystemJSからWebpack(Angular CLI)に移行したので、私のカスタムGoogleマップメーカーは表示されなくなりましたが、デフォルトのものは次のとおりです。iconUrlを使用してカスタムGoogleマップマーカーを使用するSebmGoogleMap

  <sebm-google-map-marker [latitude]="lat" [longitude]="lng"></sebm-google-map-marker> 
        <sebm-google-map-marker 
        *ngFor="let nearMovingAgent of nearMovingAgents" 
        [latitude]="nearMovingAgent.obj.location[1]" 
        [longitude]="nearMovingAgent.obj.location[0]"      
        [iconUrl]= "nearMovingAgent.obj.agent_type == 'moving_company'? iconPathMC:iconPathSS" > 

        <sebm-google-map-info-window>      
         <h5 class="modal-title" *ngIf="nearMovingAgent.obj.agent_type == 'moving_company'"><small>Moving Company</small></h5> 
         <h5 class="modal-title" *ngIf="nearMovingAgent.obj.agent_type == 'self_standing'"><small>Self Standing Bakkie/Truck Owner</small></h5> 
         <hr> 
         <p>{{nearMovingAgent.obj.address | capitalize }}</p> 
         <button class="btn view-details" data-toggle="modal" data-target="#myModal" (click)="viewMovingAgentDetail(nearMovingAgent)">View Details</button> 
        </sebm-google-map-info-window>  
        </sebm-google-map-marker> 
     </sebm-google-map> 

私は属性を削除:

[iconUrl]= "nearMovingAgent.obj.agent_type == 'moving_company'? iconPathMC:iconPathSS" 

デフォルトのアイコンは

を示していると私は私のコンポーネントクラスに次き:

iconPathMC: string = "../../../images/truck3.png"; 
iconPathSS: string = "../../../images/pickup.png"; 

私はngOnInit()の中に上記の文を移動しようとしているが、私はまだそれがエラーをスローしなくても地図上のアイコンが表示されないことはできません。 私のサーバー(NodeJS、Expressおよびnodemon)は、要求に対して200のステータスを示します。画像の:

GET /images/truck3.png 
GET /images/pickup.png 
GET /images/truck3.png 200 19.230 ms - 1347 
GET /images/pickup.png 200 20.781 ms - 1347 

がいます私は、誰もが私が行方不明ですかのアイデアを与えることができ、表示されたアイコンを持つように異なるコンポーネントのライフサイクルをフックする必要があります。 ありがとうございます。それが問題を解決したとはいえ

答えて

0

まあ、私はその後

declare var require: any; 

markerIconUrl() { 
    return require('../../../images/truck3.png') 
} 

私のコンポーネントでこれを行うことによってこれを解決してきたが

<sebm-google-map-marker 
    *ngFor="let nearMovingAgent of nearMovingAgents" 
    [iconUrl]="markerIconUrl()"      
> 

ように私のテンプレートに「markerIconUrl」メソッドを呼び出し、私はオンのままですなぜそれが問題であったかを調べると、Webpackの仕組みと関係があります。

関連する問題