1

私はこのngテンプレートを持っています

<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>

クリックすると呼び出されます

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

関数は

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

実際には角度ディレクティブの中にあります。ng-template 内ではなくディレクティブ内にある場合、ngMap は正しくレンダリングされます。私は何を間違っていますか？

4

1 に答える 1

1

最後に、タイムアウト機能を追加して問題を解決しました。ngmap は、ngDialog モーダルのロードが完了した後にのみロードする必要があります。

<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>

およびコントローラー機能

$scope.pushDialog = function () {
    ngDialog.closeAll();
    ngDialog.open({
        template: 'pushDialog',
        className: 'ngdialog-theme-default',
        scope: $scope
    });
    $timeout(function(){
        $scope.mapDisplay = true;
    }, 500);
};
于 2016-08-24T15:09:18.653 に答える