Angular 9，传单，Django：向传单映射添加多个HTTP get请求层

我需要从django后端向传单地图添加大约20层。我成功实现这一点的唯一方法是使用以下方法，同时将这些层添加到layerControl：

map.component.ts

layers: L.Layer[];
layersControl: any;

constructor(private http: HttpClient) {}
getFeatureOne = this.http.get<any>('http://localhost:8000/api/layerOne');
getFeatureTwo = this.http.get<any>('http://localhost:8000/api/layerTwo');
etc...

ngOnInit() {
    this.getFeatureOne.subscribe(
        featureOne => {
            this.getFeatureTwo.subscribe(
                featureTwo => {
                    etc..    
                    const layerOne = L.geoJSON(featureOne);
                    const layertwo = L.geoJSON(featureTwo);
                    this.layers = [layerOne, layerTwo];
                    this.layersControl = {
                        baseLayers: {
                            'Open Streets': this.openStreets
                        },
                        overlays: {
                            'Layer One': layerOne,
                            'Layer Two': layerTwo
                        }
                    };
                }
            );
        }
    );
}

层：L.Layer[]；
层控制：任何；
构造函数（私有http:HttpClient）{}
getFeatureOne=this.http.get（'http://localhost:8000/api/layerOne');
getFeatureTwo=this.http.get（'http://localhost:8000/api/layerTwo');
等
恩戈尼尼特（）{
此文件为.getFeatureOne.subscribe(
功能一=>{
this.getFeatureTwo.subscribe(
功能二=>{
等
const layerOne=L.geoJSON（功能一）；
const layertwo=L.geoJSON（功能二）；
this.layers=[layerOne，layerTwo]；
this.layersControl={
基层：{
“开放的街道”：此为“开放的街道”
},
覆盖层：{
“第一层”：第二层，
“第二层”：第二层
}
};
}
);
}
);
}

map.component.html

<div id="map"
    leaflet
    [leafletLayers]="layers"
    [leafletLayersControl]="layersControl"
    [leafletCenter]="center"
    [leafletZoom]="zoom"
    [leafletFitBounds]="fitBounds3">
</div>

肯定有什么我遗漏了，但我在这里或其他任何地方都找不到。任何帮助都将不胜感激