HTML：

<div ng-init="locationData = '<?=htmlspecialchars($data)?>'">
    <google-map center="map.center" zoom="map.zoom" options="map.options"></google-map>
</div>

角度控制器：

app.controller('MapCtrl',['$scope',function ($scope) {
    'use strict';
 
    $scope.$watch('locationData',function() {
        var location = JSON.parse($scope.locationData);
        $scope.location = {
            lng : location.longitude,lat : location.latitude
        initialize();
    });
 
    function initialize() {
        var mapOptions = {
            panControl    : true,zoomControl   : true,scaleControl  : true,mapTypeControl: true,mapTypeId     : google.maps.MapTypeId.ROADMAP
        };
 
        $scope.map = {
            center: {
                latitude: $scope.location.lat,longitude: $scope.location.lng
            },zoom: 13,options: mapOptions,};
    }
}]);

并且,我将$scope.map设置移动到控制器块的顶部,并将常量值设置为map

center: {
    latitude: 0,longitude: 0
},

,地图显示正确.

角度控制器：

app.controller('MapCtrl',function ($scope) {
    'use strict';
 
    var mapOptions = {
        panControl    : true,mapTypeId     : google.maps.MapTypeId.ROADMAP
    };
 
    $scope.map = {
        center: {
            latitude: 0,longitude: 0
        },};
}]);

如何在加载数据后使用谷歌地图指令解析并使用后端Lat,Lng数据正确显示地图？