KnockoutJS 删除动态绑定

Question

我已经设法在其他人的帮助下获得一个原型，以动态添加新的输入，并在其旁边添加特定的输入设置。但是，我一直在努力掌握如何删除我动态添加的内容。有什么想法吗？

HTML

<div class="input-row" data-bind="foreach: inputItems">                 
    <div class="input-row-item">                
        <div>   
            <label data-bind="text: label"></label>                 
            <input data-bind="attr:{ name: name, placeholder: placeholder, disabled: disabled() === 'true', value: value, type: type }">                    
        </div>
        <div>
            <input type="text" class="nb-remove" data-bind="value: label" placeholder="input label">
            <input type="text" value="text" class="nb-remove" data-bind="value: type" placeholder="input type">
            <input type="text" class="nb-remove" data-bind="value: name" placeholder="input name">
            <input type="text" class="nb-remove" data-bind="value: placeholder" placeholder="input placeholder">
            <input type="text" class="nb-remove" data-bind="value: disabled" placeholder="input disabled">
            <input type="text" class="nb-remove" data-bind="value: value" placeholder="input value">
        </div>
        <div>
            <button data-bind="click: removeInput">Remove this</button>
        </div>
    </div>                  
</div>

JS

$(function(){
    var InputItem = function InputItem(label, type, name, placeholder, disabled, value) {
        this.label          = ko.observable(label);
        this.type           = ko.observable(type);
        this.name           = ko.observable(name);
        this.placeholder    = ko.observable(placeholder);
        this.disabled       = ko.observable(disabled);
        this.value          = ko.observable(value);
    }

    var ViewModel = function ViewModel() {
      var that = this;

      this.inputItems = ko.observableArray([]);          

      this.addInput = function addInput() {
        that.inputItems.push(new InputItem());
      };

      this.removeInput = function removeInput(){
        //remove input here
      }

    }

    ko.applyBindings(new ViewModel());
});

Answer 1

你应该试试这样的东西

查看模型：

         var ViewModel = function() {
              var that = this;
              that.inputItems = ko.observableArray([new InputItem()]);  
              that.addInput = function () {
                that.inputItems.push(new InputItem());
              };

              that.removeInput = function (item){
                that.inputItems.remove(item);
              }
            }
         ko.applyBindings(new ViewModel());

工作fiddlehere

一些建议：

1) 当您分配 var that=this 时，您尝试在 vm

中始终如一地使用 that

2) 您可以像这样简单地创建一个函数名称 var fun=function() 否则您可以像这样 function fun(){//blah blah}

KnockoutJS 删除动态绑定

KnockoutJS Remove dynamic bindings

javascript

jquery

knockout.js