javascript - $http angularJS 循环每个带有传单问题的对象

标签 javascript html angularjs dictionary leaflet

我正在为 AngularJS 个人训练制作一个小应用程序,但遇到了一些错误。

我从 API 接收 Json 数据,然后我想为我获得的每个对象显示一个标记。问题是我有一个控制台错误,所以我想我犯了一个错误。

这是我的 Controller

toulouseVeloControllers.controller('toulouseVeloListCtrl', ['$scope', '$http',
  function($scope, $http) {

      angular.extend($scope, {
          osloCenter: {},
          markers: {},
          defaults: {
              scrollWheelZoom: false
          }
      });


      $http.get('https://api.jcdecaux.com/vls/v1/stations?contract=toulouse&apiKey=*********************************').success(function(data) {

          $scope.bornes = data;

          for (var i = 0; i < data.length; i++) {

              $scope.markers.osloMarker = {
                  lat: data[i].position.lat,
                  lng: data[i].position.lng,
                  message: data[i].name,
                  focus: true,
                  draggable: false
              };
              $scope.osloCenter = {
                  lat: data[1].position.lat,
                  lng: data[1].position.lng,
                  zoom: 15
              };
          }

          console.log(data.position.lat);
          console.log(data.position.lng);
      });
  }]);

在我的 map 中,我只有最后一个对象的标记。在控制台中我有“TypeError:无法读取未定义的属性'lat'”

当我尝试在 map 之外的带有 ng-repeat 的列表中显示所有对象时,没有问题。

这是我的 HTML:

<div ng-controller="toulouseVeloListCtrl">
    <leaflet markers="markers" center="osloCenter" style="width: 100%; height: 500px;"></leaflet>
</div>

知道哪里出了问题吗?

非常感谢!!

<小时/>

最佳答案

我猜问题是:

console.log(data.position.lat); 

也许你应该使用:

console.log(data[i].position.lat);

还有:

$scope.markers=[];
$scope.osloCenter=[];
for (var i = 0; i < data.length; i++) {

          $scope.markers[i].osloMarker = {
              lat: data[i].position.lat,
              lng: data[i].position.lng,
              message: data[i].name,
              focus: true,
              draggable: false
          };
          $scope.osloCenter[i] = {
              lat: data[1].position.lat,
              lng: data[1].position.lng,
              zoom: 15
          };
      }

关于javascript - $http angularJS 循环每个带有传单问题的对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31661278/

相关文章:

javascript - 从 ng-grid 访问 header 值

javascript - 如何在 JQuery 中通过属性查找元素?

JavaScript 父类和子类/对象存在此问题

javascript - 执行文本编辑的 jquery 插件

javascript - 我怎样才能找到元素的变化?

javascript - AngularJS View 更新后初始化 Bootstrap 工具提示

javascript - 如何使用 javascript 填写 ng-model 查询以过滤数据?

javascript - Sharepoint:如何通过 Javascript/JQuery 从自定义表单上的 DateTimeField 获取日期值?

javascript - 如何在容器 div 淡入淡出后在文本中使用 jquery fadein?

javascript - 有什么理由不使用 angular-loader 吗?