Bootstrap modal required ist nicht für ArcGIS server map definiert

Question

Bitte vergib mir, wenn dies sehr einfach ist, aber ich bin nicht in der Lage, herauszufinden, die Arbeit um das Problem zu lösen.

Ich versuche, ESRI-Karte in einem Bootstrap-modal zu öffnen. Beim ersten Mal wird die Karte nicht geladen (in der Konsole sehe ich den Fehler "require is not defined"), aber beim zweiten Mal funktioniert es gut. Wenn ich die Karte in einem separaten Fenster öffne, funktioniert es auch jedes Mal gut.

Meine Teilansicht sieht wie folgt aus:

@{ 
    <link rel="stylesheet" href="https://js.arcgis.com/3.21/dijit/themes/claro/claro.css"> 
    <link rel="stylesheet" href="https://js.arcgis.com/3.21/esri/css/esri.css"> 

    <script src="https://js.arcgis.com/3.21/"></script> 
    <script> 
     var map; 

     require([ 
      "esri/map", 
      "dojo/parser", 
      "dojo/domReady!" 
     ], 
     function (
      Map, 
      parser 
     ) 
     { 
      parser.parse(); 

      map = new Map("map", { 
       basemap: "streets", 
       center: [5.79, 50.97], // lon, lat 
       zoom: 16, 
       slider: false 
      }); 
     }); 
    </script> 
} 

<div class="modal-header"> 
    <a class="close" data-dismiss="modal">&times;</a> 
    <h4>DrawProjectLocation</h4> 
</div> 
<div class="modal-body"> 
    <div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%; height:100%;">  
     <div id="map" class="roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"> 

     </div> 
     <div id="footer" class="roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'"> 
      <div id="editorDiv"></div> 
     </div> 
    </div> 
</div> 
<div class="modal-footer"> 
    <span id="info" style="position:absolute; left:15px; bottom:15px; color:#000; z-index:100"></span> 
    <button type="submit" class="btn btn-success" id="submitButton">Save</button> 
    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
</div> 

Ich versuchte require.js in meinem Teilansicht zu schließen, aber es hat nicht geholfen. Kann mir bitte jemand sagen, was hier schief läuft? Vielen Dank!!

Answer 1

Schließlich habe ich das Problem gelöst, indem ich js für ArcGIS in der Hauptansicht anstelle der Teilansicht hinzugefügt habe. Da RequireJS asynchron geladen wird, warten andere Skripte/Funktionen nicht, bis sie vollständig geladen sind.

Eine andere Problemumgehung besteht darin, Bootstrap-Modal zu laden, indem Sie Konfigurationen für RequireJS einrichten, um sicherzustellen, dass alle erforderlichen Skripts zu Beginn geladen werden. Beispiel kann here

Answer 2

sein Bitte seien Sie spezifisch Ihre Frage. Wo haben Sie require.js aufgenommen? Versuchen Sie, es vor dem Skript einzuschließen und überprüfen Sie die Konsole, wenn require.js enthalten ist.