如何使用angular-google-maps <markers>指令？

Question

我在my project中使用的是angular-google-map。

我正在尝试添加多个标记，使用以下定义的对象：

vehicles = [
{
    stuff: "stuff",
    last_known_location: {
        latitude: number,
        longitude: number
    }
    
},
{
    stuff: "stuff",
    last_known_location: {
        latitude: number,
        longitude: number
    }
    
},//...etc
]

我的指令看起来像这样：

<markers models='vehicles'
         coords='vehicles.last_known_location' >
</markers>

Vehicles是如上所述的对象数组。

这不管用。如果我将模型更改为只具有纬度和经度属性，并完全失去last_known_location属性并更改我的指令coords='self'，那么它将工作得很好。我需要做什么才能让它与我的json结构一起工作呢？

Answer 1

正如您所了解的，在这里：http://angular-ui.github.io/angular-google-maps/#!/api/markers中声明了属性坐标的值必须在引号之间。

另外，在v1.1中，您需要为每个标记定义一个id ( id属性的名称由idKey提供)，它默认为model.id。

所以，在你的情况下，为了让它现在起作用，它必须是

<markers models="vehicles" coords="'last_known_location'"></markers>

和车辆数组，例如：

$scope.vehicles = [{
  id: "first",
  stuff: "stuff",
  last_known_location: {
      latitude: 37.3694868,
      longitude: -5.9803275
  }
}];

(请注意id属性)

Answer 2

我认为在已经为模型定义了数组之后，您不需要再次定义数组。你能不能试试：

<markers models='vehicles' coords='last_known_location'>  </markers>

如果你在last_known_location中没有它们，只是在父对象中，API说你可以使用'self‘来识别包含lat和lng的对象

Answer 3

两件事：

首先，将[]添加到last_known_location的定义中，使其成为一个对象数组。在Angular Google Maps的这个测试页面中，没有它，坐标就不能工作。http://www.directiv.es/angular-google-maps

其次，确保您的模块可以访问vehicles。要做到这一点，最好的方法是使其成为$scope的一部分。

angular.extend($scope, 
{
    vehicles:
        stuff = "stuff",
        last_known_location:  [{
          latitude: 45,
          longitude: -74
        }]
  });

那么@jOshT响应中的标记就会起作用：

<marker models='vehicles' coords='last_known_location'>  </markers>

更新

根据评论，我误解了这个实现使用的是markers而不是marker。前者要求coords对象为string，后者要求expression。使用原始代码序列化last_known_location将会起作用。