Leaflet: Unhandled promise rejection

[michimau (Mauro Michielon)]

I have a plugin which make use of leaflet, it used to work fine under 5.5.

Under 6.1.x i bump into:
Unhandled promise rejection Error: Map container not found.

in my controller.js have:
"var map = null;
map = L.map('.map-vis', {
scrollWheelZoom: true,
wheelPxPerZoomLevel: 5,
wheelDebounceTime: 40,
zoomDelta: 0.5,
center: [53, 11],
zoom: 4,
maxZoom: 30,
minZoom: 3
});"

my vis template is:
"< div ng-controller="leafletwmsController" >
< div class="map-vis">
< /div >
< /div >"

it looks like "map-vis" does not exists when it is used in the controller.js.
any clue why it stopped to work under 6?

best
michimau

[Nathan_Reese]

Try wrapping map initialization inside $timeout(initMap, 0);. This will allow the current digest cycle to finish and the DOM to be updated before calling your initMap functionality.

[michimau (Mauro Michielon)]

Thank you Nathan,

i am not sure i can follow your advice tho
With the same outcome, I have tried both:

setTimeout(initMap(), 0);
function initMap() {
var mymap = L.map('map-vis').setView([51.505, -0.09], 13);
}

$timeout(initMap(), 0);
function initMap() {
var mymap = L.map('map-vis').setView([51.505, -0.09], 13);
}

var initMap = function () {
var mymap = L.map('map-vis').setView([51.505, -0.09], 13);
}
$timeout(initMap(), 0);

if you want to have a deeper look, i have uploaded a minimalistic example:

michimau/leaflet_test/blob/master/public/leaflet-wms_controller.js

[michimau (Mauro Michielon)]

I was distracted by other matters and i forgot to comment. I confirm you nailed it
Thanks