为什么数据绑定在字符串中不起作用?

Why data-bind doesn't work inside a string?

我正在尝试向 Google 地图中的工具提示(信息 Windows)添加一个按钮。我在一个字符串中生成这个按钮,我只是将这个字符串添加到工具提示的内容中,这样它就会在工具提示中生成按钮。问题是数据绑定似乎不是这样工作的。

这是一张图片:https://imgur.com/gpyl0Mr

function MapViewModel() {
  var self = this;
  self.removeTurbineColor = ko.observable(false);

  function addToolTip(currentTurbine, turbineIcon){
    var turbineToolTip = "name";

    turbineToolTip += "<button id='remove-emergency-turbine' data-bind='click: 
    removeTurbineColor'> remove </button>";


   self.removeTurbineColor.subscribe( function() {
     console.log("turbine changed");
   });

  var infoWindowTurbine = new google.maps.InfoWindow({content: turbineToolTip});

  if(turbineIcon){
    google.maps.event.addListener(turbineIcon, "click", function(){
      infoWindowTurbine.setPosition(turbineIcon.getPosition());
      infoWindowTurbine.open(self.map, turbineIcon);
     });
   }

 }
}

当我点击按钮时,我希望控制台中的输出是 "turbine changed",但什么也没有出现。

Knockout 绑定在您第一次调用 ko.applyBindings 时设置。它不会为初始绑定后插入的元素应用绑定。

您可以附加一个按钮元素并手动附加一个点击事件处理程序,而不是插入 HTML。

或者,可能更好,您可以 hard-code 按钮 HTML,以便在 ko.applyBindings 应用它的绑定,并用另一个可观察对象切换它的可见性。