角度2リーフレットタイルの巨大なギャップ

Question

罰金私の角度2アプリケーション、リーフレット負荷の外に同じ設定を使用して

が、これは角度2で何が起こるかです：私は、マップ、異なるタイルの負荷を移動した場合

が、同じ問題は続く。

HTML：

<div class="leaflet-maps" id="map"></div> 

コンポーネント：私はリーフレットの内容を貼り付けた場合は

styleUrls: ['./maps.component.scss'] 

：私はを通じてリーフレットのCSSファイルをロードした

let el = this._elementRef.nativeElement.querySelector('.leaflet-maps'); 

    let map = L.map("map", { 
     zoomControl: false, 
     center: L.latLng(37.8, -96), 
     zoom: 5, 
     minZoom: 4, 
     maxZoom: 19 
    }); 

    L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
     attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' 
    }).addTo(map); 

CSS

/* required styles */ 

.leaflet-pane, 
.leaflet-tile, 
.leaflet-marker-icon, 
.leaflet-marker-shadow, 
.leaflet-tile-container, 

.... 

Answer 1

これは私の問題を修正：

import { Component, ViewEncapsulation} from '@angular/core'; 

@Component({ 
    selector: 'maps', 
    templateUrl: 'maps.component.html', 
    styleUrls: ['./maps.component.scss'], 
    encapsulation: ViewEncapsulation.None // <-- 
})