3

我对ember-leaflet图书馆和弹出窗口的正确使用有疑问。

以下来自ember-leaflet网站的示例使用该库添加标记和链接弹出窗口。它还说明了如何通过内容绑定为弹出窗口添加内容。

RadMarkersApp = Ember.Application.create();
RadMarkersApp.MarkerLayer =
  EmberLeaflet.MarkerLayer.extend(
    EmberLeaflet.DraggableMixin,
    EmberLeaflet.PopupMixin, {
  popupContentBinding: 'content.title'
});

RadMarkersApp.MarkerCollectionLayer =
  EmberLeaflet.MarkerCollectionLayer.extend({
    content: [{
      location: L.latLng(40.7127, -74.0060),
      title: 'City Hall'}],
    itemLayerClass: RadMarkersApp.MarkerLayer
  });

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

现在我希望能够在popupContent此处为该属性使用视图或 Handlebars 模板。有人对如何实现这一点有任何想法吗?这种情况有什么最佳实践吗?

我的第一种方法:

App.MarkerLayer =
  EmberLeaflet.MarkerLayer.extend(
    EmberLeaflet.PopupMixin, {

    popupContent: function() {
      // Render view (how to get?) or handlebars template
      return Ember.TEMPLATES['popup-content'](this.get('content'))
    }.property()
  });

这会导致以下错误:

Uncaught TypeError: Cannot call method 'push' of undefined 

希望有人可以提供帮助。

4

1 回答 1

3

I'm a little idiot not beeing able to look up helpfull functions in the documentation.

I was able to fix this with a little hack and the help of Ember.View#createElement:

App.MarkerLayer = EmberLeaflet.MarkerLayer.extend(EmberLeaflet.PopupMixin, {
  popupContent: function() {
    view = this.view = this._parentLayer.createChildView('map-popup');
    view.set('context', this.get('content'));
    Ember.View.states.inDOM.enter(view)
    view.createElement();

    return view.get('element');
  }.property()
});

Hope this will help others.

于 2013-10-02T17:26:33.947 回答