Javascript 无限循环，用于将标签包装到淘汰组件中

我创建了一个基于Droyad的定制绑定来包装。最终代码（简化）为：

ko.bindingHandlers.tagit={
init:function（元素、valueAccessor、allBindingsAccessor）{
var bind=函数（）{
valueAccessor（）.tagsList（$（元素）.tagit（“assignedTags”）；
};
变量选项=$.extend({
后加：绑定，
后移：绑定
}，valueAccessor（）.options |{}）；
//创建标记编辑器
$（元素）.tagit（选项）；
//////第一区
var value=ko.utils.unwrapobbservable（valueAccessor（））；
var tags=value.tagsList（）；
对于（var x=0；x

相应的HTML为：

<div data-bind="with: currentDocument">
  <input data-bind="tagit: {tagsList: tags}"></input>
</div>

我的问题是：我必须使用“块1”并删除“块2”，否则组件将进入无限循环。 没有block 2，tag每次我更改文档（currentDocument更改）时，它都会显示标记，并且我可以手动编辑标记而不会出现问题。相反，如果我以编程方式更改currentDocument.tags，则更改不会可视化（显然）。 如果我删除块1并添加块2，则后加回调将为每个添加的标记激发，从而更改标记数组，激发更新函数等等

你知道怎么解决这个问题吗？我认为如果只为手动修改而不是$（element.tagit（“createTag”，tags[x]），才触发后taged和后tagremoved回调；这个问题是可以解决的。

---

谢谢你的帮助

解决方案很简单，但并不优雅。我定义了一个“加载”变量，当加载标签编辑器导致更改时，该变量被设置为true。如果为true，则会阻止可观察更新。（在前面的代码中，删除块1并添加块2）

像往常一样，试着解释一下这个问题，帮助我找到解决办法。也谢谢你

ko.bindingHandlers.tagit = {
    loading: false,
    init: function (element, valueAccessor, allBindingsAccessor) {
        var bind = function () {
            if(ko.bindingHandlers.tagit.loading) return;
            valueAccessor().tagsList($(element).tagit("assignedTags"));
        };
        ...
    },
    update: function (element, valueAccessor, allBindingsAccessor) {
        // Load data
        ko.bindingHandlers.tagit.loading = true;
        var value = ko.utils.unwrapObservable(valueAccessor());
        var tags = value.tagsList();
        $(element).tagit("removeAll");
        for(var x = 0; x < tags.length; x++) {
            $(element).tagit("createTag", tags[x]);
        }
        ko.bindingHandlers.tagit.loading = false;
    }

ko.bindingHandlers.tagit={
加载：false，
init:function（元素、valueAccessor、allBindingsAccessor）{
var bind=函数（）{
if（ko.bindingHandlers.tagit.loading）返回；
valueAccessor（）.tagsList（$（元素）.tagit（“assignedTags”）；
};
...
},
更新：函数（元素、valueAccessor、allBindingsAccessor）{
//加载数据
ko.bindingHandlers.tagit.loading=true；
var value=ko.utils.unwrapobbservable（valueAccessor（））；
var tags=value.tagsList（）；
$（元素）.tagit（“removeAll”）；
对于（var x=0；x

看起来您不需要删除并重新创建所有标记，只需要删除不应该存在的标记，然后添加应该存在的标记。

ko.bindingHandlers.tagit = {
    loading: false,
    init: function (element, valueAccessor, allBindingsAccessor) {
        var bind = function () {
            if(ko.bindingHandlers.tagit.loading) return;
            valueAccessor().tagsList($(element).tagit("assignedTags"));
        };
        ...
    },
    update: function (element, valueAccessor, allBindingsAccessor) {
        // Load data
        ko.bindingHandlers.tagit.loading = true;
        var value = ko.utils.unwrapObservable(valueAccessor());
        var tags = value.tagsList();
        $(element).tagit("removeAll");
        for(var x = 0; x < tags.length; x++) {
            $(element).tagit("createTag", tags[x]);
        }
        ko.bindingHandlers.tagit.loading = false;
    }