javascript - 如何在 JavaScript 字符串中编译 Ember Action ？

Question

在我的 Ember 组件 items-map.js 中，我正在调用 Google map 。 Google Map API 允许我拥有 infoWindows(单击 map 上的任何图钉后打开的气泡)。

我在这些气泡中有一些 HTML 内容，单击其中的链接应该会转换到另一条路线。我正在尝试使用组件内的操作来实现此目的，但为了做到这一点，我首先需要能够将 Handlebars 语法编码到 infoWindow 的 HTML 中。

JavaScript 字符串如下所示:

var infoWindowContent = '<a class="btn" href="javascript:void(0);" {{action "routeToItem"}}>See Items</a>';

如您所见，我在字符串中有一个 Handlebars 操作。呈现按钮时，不会编译 Handlebars 操作。我尝试将上面的字符串包装在一个“Handlebars.compile()”方法中，如下所示:

var infoWindowContent = Ember.Handlebars.compile('var infoWindowContent = '<a class="btn" href="javascript:void(0);" {{action "routeToItem"}}>See Items</a>';');

这产生了一个错误。我现在没有看到按钮，而是看到文本 [object Object] 按钮应该位于的位置。我该如何解决这个问题？

Answer 1

因为我也有同样的问题，但我已经使用 jquery 以这种方式接近，确保它会起作用，试试吧。

var infoWindowContent = "<span class=\"tooltip-text\">" +
                       "<span class=\"infowIndow\">" +
                       "<a href=\"#/vehicle/<%= uuid %>\"><%= name %></a>" +
                      "</span>" +
                      "<span class=\"tool-tip firstItem-tool-tip\"><%= tool_tip_name %></span></span>";

 var t = this;
 var vehicle_uuid = 'aBCfdf';
 var infowindow = new google.maps.InfoWindow({
    content: infoWindowContent
  });

  var marker = new google.maps.Marker({
    position: uluru,
    map: map
  });

  marker.addListener('click', function() {
    infowindow.open(map, marker);

    $('.infowIndow').on('click', function() {
        // as I am also doing in component I am using t.get('targetObject')
       t.get('targetObject').transitionToRoute('vehicle.history', vehicle_uuid);
   });
  });