Javascript 使用$stateparms访问URL中的变量

我正在构建AngularJS应用程序，对$stateParams服务感到困惑。我试图将Google Maps“center”变量指定为URL中的lat和lon值

这是我的.config：

  .config(function ($stateProvider) {
      $stateProvider.state('location', {
          url: '/:lat/:lon',
          templateUrl: 'index.html',
          controller: 'MapsCtrl',
          resolve: {
              resolveMap: function (MapService, $stateParams) {
                  return MapService.getData($stateParams.lat, $stateParams.lon, $stateParams.radius);
              }
          }
      });

  })

这是我的控制器的开始，在这里我定义了中心：

.controller('MapsCtrl', ['$scope', "uiGmapLogger", "uiGmapGoogleMapApi", "$interval", "$state", "$stateParams",
  function ($scope, $log, GoogleMapApi, $interval, $state, $stateParams, $http) {
      $log.currentLevel = $log.LEVELS.debug;
      var center = { latitude: $stateParams.lat, longitude: $stateParams.lon };

我收到错误：“谷歌地图：找不到有效的中心属性”

---

这是一个JS FIDLE，但它不显示任何输出（可能是因为上面的错误）：

问题在于您试图在设置变量之前绑定它们。您首先需要确保所有google map指令参数都有效。如果，您可以将

ui-gmap-google-map

指令元素包装为

ng，以确保地图属性已准备就绪

我相信你可以用

ng-if="map.center !== undefined"

当然。基本上，在绑定有效属性之前不要渲染元素。您还可以设置默认值并避免ng if

有关更多详细信息，请参阅。
问题在于您试图在设置变量之前绑定变量。您首先需要确保所有google map指令参数都有效。如果

，您可以将

ui-gmap-google-map

指令元素包装为

ng，以确保地图属性已准备就绪

我相信你可以用

ng-if="map.center !== undefined"

当然。基本上，在绑定有效属性之前不要渲染元素。您还可以设置默认值并避免ng if

有关详细信息，请参阅。
更改视图时，您应该传递纬度和经度

$tate.go(stateName, {}, {latitude: value, longitude: value})

此外，在定义状态时，还应使用默认值设置参数

.state(
     .....
     params: {
          latitude: defaultValue,
          longitude: defaultValue
     }
 )

当你改变视图时，你应该通过纬度和经度

$tate.go(stateName, {}, {latitude: value, longitude: value})

此外，在定义状态时，还应使用默认值设置参数

.state(
     .....
     params: {
          latitude: defaultValue,
          longitude: defaultValue
     }
 )

谢谢你把它修好了！但现在我得到了谷歌地图API警告：noapikees，页面上没有加载任何内容：。但这以前不是问题，我从repo得到这段代码的管理员说你不需要API密钥。。。你知道发生了什么吗？听起来要么他们错了，要么事情已经改变了，你确实需要一个地图API。不必担心，你可以免费得到一个。是的，我以前做过，但我不知道该把这个应用的钥匙放在哪里。它会在index.html中出现在结束体标记之前吗？IIRC API键加载到Google API脚本中。检查是否在配置对象中传递了它我进入了issue-1169-windows-update.js，在.config下添加了key:[myKey]，但我仍然收到了无api密钥错误，谢谢你修复了它！但现在我得到了谷歌地图API警告：noapikees，页面上没有加载任何内容：。但这以前不是问题，我从repo得到这段代码的管理员说你不需要API密钥。。。你知道发生了什么吗？听起来要么他们错了，要么事情已经改变了，你确实需要一个地图API。不必担心，你可以免费得到一个。是的，我以前做过，但我不知道该把这个应用的钥匙放在哪里。它会在index.html中出现在结束体标记之前吗？IIRC API键加载到Google API脚本中。检查是否在配置对象中传递了它我进入了issue-1169-windows-update.js，在.config下添加了key:[myKey]，但我仍然收到无api密钥错误