无法使用 AngularJS (NgMap) 动态切换语言答案

【问题标题】：Not able to switch language dynamically using AngularJS (NgMap)无法使用 AngularJS (NgMap) 动态切换语言
【发布时间】：2018-10-18 09:02:15
【问题描述】：

我正在使用 ngmap (http://ngmap.github.io) 版本 1.18.4，角度版本 1.4.9。

我想切换语言，但没有生效。我看到了一些已经讨论过的问题，例如：

https://github.com/allenhwkim/angularjs-google-maps/issues/760

以上问题已通过建议删除脚本标记而关闭。我没有加载谷歌地图的脚本标签。我有以下代码：

index.html:

<script src='bower_components/ngmap/build/scripts/ng-map.js'></script>

控制器代码：

$scope.markers = [$scope.latitude, $scope.longitude];
$scope.mapParams = 'https://maps.google.com/maps/api/js?language=' + $scope.locale;    

$timeout(function() {
  NgMap.getMap({id: 'site-map'}).then(function(map) {
    google.maps.event.trigger(map, 'resize');
    map.setCenter(new google.maps.LatLng($scope.latitude, $scope.longitude));
  });
}, 2000);

HTML代码：

<div map-lazy-load="https://maps.google.com/maps/api/js?key=abc&v=3.34" map-lazy-load-params="{{ mapParams }}">
    <ng-map id="site-map" center="{{[ latitude, longitude ]}}" zoom="question.zoom"
    >
      <marker position="{{ markers }}"></marker>
    </ng-map>
</div>

我在 map-lazy-load-params 中尝试了不同的组合，但没有任何效果。几个组合是：

$scope.mapParams = '&language=' + $scope.locale;
$scope.mapParams = 'https://maps.googleapis.com/maps/api/js&language=' + $scope.locale;

静态语言工作得非常好，就像我这样做是为了验证地图语言是否发生变化。

<div map-lazy-load="https://maps.google.com/maps/api/js?key=abc&v=3.34&language=ja">

谁能告诉我解决办法？

【问题讨论】：

标签： javascript angularjs google-maps ng-map

【解决方案1】：

加载谷歌地图后，无法更改语言。 ng-map 库似乎不支持在 API 发生更改时自动重新加载，因此自定义解决方案是重新渲染 ng-map 组件。

您可以使用ng-if 来销毁当前的 ng-map 并重新创建它。

【讨论】：

当我这样做时，它会改变语言：
maps.google.com/maps/api/js?key=abc&v=3.34" map-lazy-load-params="maps.google.com/maps/api/js?language=ja"> 但是，如果我像这样从控制器设置 map-lazy-load-params。然后它不起作用。 $scope.mapParams = 'maps.google.com/maps/api/js?language=' + $scope.locale;
是的，仅仅改变控制器的参数是行不通的——正如我提到的，你必须重新渲染整个组件。
我正在 $scope.apply 超时内重新渲染组件，但是它不起作用。能举个例子吗？
一个hacky方法是在模板中设置ng-if="$ctrl.showMap"，并有一个changeLanguage() {this.showMap = false; this.showMap = true;}函数。它应该再次渲染地图，可能会在再次将其设置为 true 之前添加超时。