NgMap nicht in ngDialog gemacht

Question

Ich habe dieses ng-template

<script type="text/ng-template" id="pushDialog"> 
<div class="col-md-12"> 
    <div class="col-md-6"> 
     <md-input-container class="md-block"> 
      <input ng-model="pushLocName" type="text" ng-required="true" places-auto-complete on-place-changed="placeChanged()" aria-label="Location Name" types=['geocode'] required> 
     </md-input-container> 

     <md-input-container class="md-block" style="margin-top:0;"> 
      <ng-map center="{{spark.location[1] || spark.lat}},{{spark.location[0] || spark.lng}}" zoom="8" default-style="false" > 
       <marker animation="DROP" position="{{pushPayload.location[1]}}, {{pushPayload.location[0]}}" draggable="true" on-dragend="getMarkerLocation()" animation="Animation.BOUNCE"></marker> 
      </ng-map> 
     </md-input-container> 
    </div> 
</div> 
<div class="ngdialog-buttons"> 
    <button type="button" class="ngdialog-button pull-left ngdialog-button-primary" ng-click="pushSpark()"> Confirm</button> 
    <button type="button" class="ngdialog-button pull-right ngdialog-button-secondary" ng-click="closeThisDialog('Cancel')"> Cancel</button> 
</div> 

aufgerufen, seine auf in der Tat klicken

<h5 ng-click="pushDialog()"><span class="pull-right glyphicon glyphicon-share"></span></h5> 

die Funktion

  $scope.pushDialog = function() { 
      ngDialog.closeAll(); 
      ngDialog.open({ 
       template: 'pushDialog', 
       className: 'ngdialog-theme-default', 
       scope: $scope 
      }); 
     }; 

ist, die ist innerhalb einer Winkelanweisung. Die ngMap wird korrekt gerendert, wenn sie nicht in ng-template, sondern in direction enthalten ist. Was mache ich falsch?

Answer 1

Ich löste das Problem schließlich durch Hinzufügen einer Timeout-Funktion. Das ngmap muss erst geladen werden, nachdem das modale Laden von ngDialog beendet wurde.

<ng-map center="{{spark.location[1] || spark.lat}},{{spark.location[0] || spark.lng}}" zoom="8" ng-if="mapDisplay" > 
    <marker animation="DROP" position="{{pushPayload.location[1]}}, {{pushPayload.location[0]}}" draggable="true" on-dragend="getMarkerLocation()" animation="Animation.BOUNCE"></marker> 
</ng-map> 

und Reglerfunktion

$scope.pushDialog = function() { 
    ngDialog.closeAll(); 
    ngDialog.open({ 
     template: 'pushDialog', 
     className: 'ngdialog-theme-default', 
     scope: $scope 
    }); 
    $timeout(function(){ 
     $scope.mapDisplay = true; 
    }, 500); 
};