帶有其他功能的敲除寄存器插入元素

Question

我正在使用Knockout爲圖像數組顯示一些標籤。每個標籤都會有一個彈出窗口，提供有關該標籤的更多信息。元素註冊於彈出類的方式如下：

function RegisterCharacterPopups() { 
    $('[data-characterid]').each(function() { 
     var cId = $(this).data('characterid'); 
     var placement = $(this).data('position'); 
     if (placement == null || placement == undefined) { 
      placement = "top-center"; 
     } 
     $(this).PopUp({ 
      url: "/Ajax/CharacterPop/" + cId, 
      position: placement, 
     }); 
    }); 
} 

而且我已經加入這個我視圖模型的構造函數中包含標籤：

// Hook on to update of Tags 
ko.computed(() => { 
    var test = this.Tags(); 
    RegisterCharacterPopups(); 
    console.log("Tags updated"); 
}); 

我能看到的是執行的方法但標籤不會在彈出窗口中註冊。如果它強制標籤再次更新，它會工作，但！ 我覺得問題在於這個方法在第一次執行之前，元素都在html中。 我該如何解決這個問題，以便在執行之前等待插入元素？

Answer 1

解決方案：自定義綁定

ko.bindingHandlers['tagpop'] = { 
    init: function (element, valueAccessor, allBindings, vm, context) { 
     var data = valueAccessor(); 
     $(element).PopUp({ 
      url: "/Ajax/CharacterPop/" + data.id, 
      position: data.placement, 
     }); 

    }, 
    update: function (element, valueAccessor) { 
    } 
};