Dynamically add data to geoJSONShape

[v1r0x]

I'm very happy with ui-leaflet, but now I'm stuck. I had all my geojson data in an object which looked like this:

map.map.geojson = {
    data: {
        type: 'FeatureCollection',
        features: []
    },
    style: {...},
    onEachFeature: {...}
}

The data gets loaded in the background and is then pushed to map.map.geojson.data.features. The map.map.geojson is passed to the leaflet directive <leaflet geojson="map.geojson"></leaflet>. Now I want to split the data into different geojson layers. Therefore I get a list with different element groups which are my different layers. I set up these layers as so:

for(var i=0; i<list.length; i++) {
    var elem = list[i];
    var currentLayer = {};
    currentLayer.name = elem.name;
    currentLayer.type = 'geoJSONShape';
    currentLayer.data = {
        type: 'FeatureCollection',
        features: []
    }
    currentLayer.layerOptions = {
        style: {...},
        onEachFeature: {...}
    }
    ...
    map.map.layers.overlays[elem.id] = currentLayer;
}

But I don't see anything on my map. onEachFeature doesn't get called. I couldn't find any tutorial or code on how to update a layer of type geoJSONShape. Is this even possible? Did I miss something?

regards v1r0x

[andyroschy]

I think the layers directive doesn't support geoJson layers. If you want to have multiple geo-json layers, you need to add the attribute geojson-nested="true" to your angular directive.

And then, you'll need to add a new property/key on your geojson object, with each geoJson layer. So, instead of having this:

map.map.layers.overlays[elem.id] = currentLayer; You'll end up with something like this: map.map.geojson[elem.name] = currentLayer;