и наблюдал то же поведение, есть ли другой момент, который я должен пытаться поймать?
тоящее время я пытаюсь создать карту листовки внутри углового материала2tab-group
как показано ниже
import {Component, NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import { MaterialModule } from '@angular/material';
import { Component, OnInit, OnDestroy } from '@angular/core';
import 'leaflet';
@Component({
selector: 'minimap',
template: `<div #minimap [id]="id" class=leaflet-map></div>`
})
export class MiniMap implements OnInit, OnDestroy {
map: L.Map = null;
id: string;
constructor() {
this.id = "map" + Date.now();
}
ngOnInit() {
this.map = L.map(this.id).setView([54.5, -115.0], 13);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution:
'© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(this.map);
}
ngOnDestroy() { }
}
@Component({
selector: 'my-app',
template: `
<div>
<h2>Hello {{name}}</h2>
<md-tab-group>
<md-tab label="tab 1">
tab 1 content
</md-tab>
<md-tab label="tab 2">
tab 2 content
</md-tab>
<md-tab label="map tab">
<minimap></minimap>
</md-tab>
</md-tab-group>
</div>
`,
})
export class App {
name:string;
constructor() {
this.name = 'Angular2'
}
}
https://plnkr.co/edit/dLwhv3XoMWMYFkqztkuR?p=preview
К сожалению, когда он пытается создать карту в компоненте, он выдает ошибку, говорящую, что контейнер карты еще не существует. моя интерпретация заключается в том, что код в данный момент выполняется до создания объекта DOM.
Как правильно создать карту так, чтобы код вызывался, когда объект DOM существует?