Knockout.js 剑道击倒：当更改bind元素的值时绑定会中断

我将使用之前提出的问题的代码，但有一些细微的更改，但情况有所不同：

HTML:

myProductionStatesList

是一个可观察的列表。点击按钮弹出窗口，我正在实例化

ProductionStatesList

视图模型，并将其值分配给

myProductionStatesList

。第一次点击按钮时，一切正常。当您关闭弹出窗口并再次单击按钮时，绑定被破坏，并且什么也没有发生。我希望每次点击按钮，ProductionStatesList的新实例都会反弹，因为

myProductionStatesList

是一个可观察的实例。我错过了什么

jsfiddle：

---

我认为，在这种情况下，您最好的选择是不需要多次调用

ko.applyBindings

一个不错的选择是创建一个视图模型，该模型有一个可观察的对象来保存当前的

ProductionStatesList

和

openPopup

函数。然后，在编辑器周围使用带绑定的

视图模型可能看起来就像：

var viewModel = {
    myProductionStatesList: ko.observable(),
    openPopup: function() {
       var newList = new ProductionStatesList();
       this.myProductionStatesList(newList);
       newList.openPopup();
    }
};

以下是一个示例：

    var ProductionStatesList = function() {
    var self = this;

    ProductionStatesList.prototype.productionStates = 
        ko.observableArray([ { ProductionState: ko.observable("Pending") } ]);

        ProductionStatesList.prototype.openPopUp = function () {
            self.isOpen(true);
        };     

        ProductionStatesList.prototype.isOpen = ko.observable(false);

        ProductionStatesList.prototype.close = function () {
            self.isOpen(false);
        }
};
    var elementIsBound = function (elementId) {
                return !!ko.dataFor(document.getElementById(elementId));
            };


    var myProductionStatesList = ko.observable();
    var openPopUp = function(){
        myProductionStatesList(new ProductionStatesList()); 
        if (!elementIsBound("productionStates")){
            ko.applyBindings(myProductionStatesList, document.getElementById("productionStates"));
        }

        myProductionStatesList().openPopUp(); 
    }

var viewModel = {
    myProductionStatesList: ko.observable(),
    openPopup: function() {
       var newList = new ProductionStatesList();
       this.myProductionStatesList(newList);
       newList.openPopup();
    }
};