전단지 customcontrol - 각도 2+ 내 Angular2 + 구성 요소에서 사용자 지정 양식 컨트롤을 통합 할 필요

Question

:

export class HeatMapComponent { 
... 
    onMapReady(map: L.Map) { 
    let div = L.DomUtil.create('div', 'info'); 
    let info = new L.Control(); 
    info.onAdd =() => { 
     return div; 
    }; 
    info.addTo(map); 
    } 
} 

그리고이 같은 .hmtl 파일 :

<div class="map container-fluid" 
    leaflet [leafletOptions]="options" 
    [leafletLayersControl]="layersControl" 
    (leafletMapReady)="onMapReady($event)"> 
</div> 

.CSS :

... 

    .info { 
     padding: 2rem 1rem; 
     margin-left: 70rem; 
     margin-right: 15rem; 
     font: 1rem/1.5rem Arial, Helvetica, sans-serif; 
     background: white; 
     background: rgba(255,255,255,0.8); 
     box-shadow: 0 0 15px rgba(0,0,0,0.2); 
     border-radius: 5px; 
    } 

다음과 같은 .JS로 작성된 전단지에 :

var info = L.control();info.onAdd = function (map) { 
this._div = L.DomUtil.create('div', 'info'); // create a div with a class "info" 
this.update(); 
return this._div; 
}; 
// method that we will use to update the control based on feature properties passed 
info.update = function (props) { 
    this._div.innerHTML = '<h4>US Population Density</h4>' + (props ? 
     '<b>' + props.name + '</b><br />' + props.density + ' people/mi<sup>2</sup>' 
     : 'Hover over a state'); 
}; 

info.addTo(map); 

내 onMapReady에서 addTo 메소드를 통합 할 수없는 이유를 아는 사람이 있습니까? 오류는 발생하지 않지만 내지도에는 아무 것도 표시되지 않습니다.

onMapReady(map: leaflet.Map) { 
let div = leaflet.DomUtil.create('div', 'infoControl'); 
let info = new leaflet.Control(); info.onAdd =() => { 
return div; 
    }; 
console.log(div); 
info.addTo(map); 
} 

Answer 1

는 난의 해결책이이 문제를 해결했다. "this.infoControl = L.control;`````this.infoControl = L.control();``이어야합니다.