建模成ui-gmap-marker

Vitor Carvalho 发表于 Dev

维托尔·卡瓦略（Vitor Carvalho）

我需要使用ui-gmap-marker的ng-model指令的帮助。我的示例app.js是：

// DevicesController
$scope.devices = {
   id: 1,
   center: { latitude: X, longitude Y },
   options: {
       show: true,
       name: 'device 1',
       radius: 100 
   }
   (...)
}

我的index.html是：

  <ul ng-controller="DevicesController">
      <li ng-repeat="d in devices">
           <input type="checkbox" ng-model="d.options.show">
           <span>{{ d.options.name }}</span>
      </li>
  </ul>
  (...)

  <div id="map_canvas" ng-controller="DevicesController">
      <ui-gmap-marker 
          ng-repeat="d in devicesMarkers track by d.id" 
          idkey="d.id"
          coords="d.center"
          ng-model="d.options.show">
      </ui-gmap-marker>
 (...)

如何使用ng-model？因为我在两个不同的地方使用同一个控制器，所以不起作用吗？我希望用户能够单击输入复选框，并且标记显示/消失。

Pankaj Parkar

我建议将两个div都包装在同一个控制器中，而不要为它们提供单独的控制器。

标记

<div ng-controller="DevicesController">
  <ul>
      <li ng-repeat="d in devices">
           <input type="checkbox" ng-model="d.options.show">
           <span>{{ d.options.name }}</span>
      </li>
  </ul>
  (...)

  <div id="map_canvas">
      <ui-gmap-marker 
          ng-repeat="d in devicesMarkers track by d.id" 
          idkey="d.id"
          coords="d.center"
          ng-model="d.options.show">
      </ui-gmap-marker>
 </div>
 (...)

</div>