Анализ координат ember-листовки из json с использованием моделей ember

Question

я новичок в ember и ember-leaflet.js.Я пытаюсь передать данные (через ajax позвонить в json файл) как в мой шаблон руля, так и в мою карту-листовку.При моей текущей настройке данные прекрасно достигают моего шаблона руля, но не отображают данные координат на карте ember-leaflet.

В качестве руководства я использую два примера, перечисленные ниже, но застрял в тупике из-за отсутствия опыта работы с ember.Может ли кто-нибудь указать мне в правильном направлении, пожалуйста?

Пример Ajax и Ember

Частичный пример того, чего я пытаюсь достичь

Шаблон руля:

 <script type="text/x-handlebars" data-template-name="application">
    {{outlet}}

  </script>

   <script type="text/x-handlebars" data-template-name="index">
      {{view App.MapView id="map"}}
      <div id="blog">
        <ul>
            {{#each item in model}}
                <li>{{item.headline}}</li>
            {{/each}}
        </ul>    
    </div>  
  </script>

Эмбер:

App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

App.IndexRoute = Ember.Route.extend({
    model: function(){
        return App.Item.all();
    }
});

App.Item = Ember.Object.extend();

App.Item.reopenClass({
  all: function() {
      return $.getJSON("js/data/test_e.json").then(function(response) {
        var items = [];

        response.features.forEach( function (data) {
          items.push( App.Item.create(data) );
        });

          return items;
      });
  }
});

App.MarkerCollectionLayer =
  EmberLeaflet.MarkerCollectionLayer.extend({
    locationBinding: 'controller.item.center'});

App.MapView = EmberLeaflet.MapView.extend({
    childLayers: [
      EmberLeaflet.DefaultTileLayer,
      App.MarkerCollectionLayer]
});

App.IndexController =
  Ember.Controller.extend({});

JSON-файл:

{
    "features": [
        {
            "headline": "Docker, the Linux container runtime: now open-source",
            "center" : [40.714, -74.000]
        },
        {
            "headline": "What's Actually Wrong with Yahoo's Purchase of Summly",
            "center" : [40.714, -73.989]

        }
    ]
}

Answer 1

Основное исправление, необходимое здесь, - это locationBinding в MarkerCollectionLayer.А location привязка должна находиться в классе MarkerLayer.Кроме того, вам необходимо использовать EmberLeaflet.computed функции для преобразования простых массивов lat lng в объект Leaflet LatLng.См. этот пример:

App.MarkerCollectionLayer = EmberLeaflet.MarkerCollectionLayer.extend({
  content: Ember.computed.alias('controller'),
  itemLayerClass: EmberLeaflet.MarkerLayer.extend({
    location: EmberLeaflet.computed.latLngFromLatLngArray('content.center'),
  })
});

Посмотрите этот JSFiddle с полным рабочим примером: http://jsfiddle.net/xALu4/2/