Knockout.JS 'enable' 绑定长度条件无效

Knockout.JS 'enable' binding on length condition not working

所有数据显示和添加/删除按钮似乎都有效,直到我更改删除按钮进行检查以确保屏幕上始终至少有一个人:

<!-- Check number of items before enabling delete button  !-->
<button type="button" data-bind='enable: people().length > 1, click: $root.removePerson'>Delete</button>

错误如下:

Uncaught ReferenceError: Unable to process binding "foreach: function (){return people }" Message: Unable to process binding "enable: function (){return people().length > 1 }" Message: people is not defined

HTML

<div data-bind='foreach: people'>
    <div class="personWell">  
       <input type="text" data-bind="value: name"></input>
       <input type="text" data-bind="value: company"></input>

       <button type="button" class="btn btn-sm btn-warning" data-bind='click: $root.removePerson'>Delete</button>
     </div> 
</div>   

<button type="button" class="btn btn-sm btn-primary" data-bind='click:addPerson'>Add Person</button>

JavaScript

var ObservedPersonModel = function(people) {

    var self = this;
    self.people = ko.observableArray(people);

    self.addPerson = function() {
        self.people.push({
            person_id:"",
            name: "",
            company: "",
            positive_observation_id:""
        });
    };

    self.removePerson = function(person) {
        self.people.remove(person);   
    }; 
};

//originalPeopleObserved is a JSON encoded list of objects
var peopleViewModel = new ObservedPersonModel(originalPeopleObserved);
ko.applyBindings(peopleViewModel);

资源

以下是我了解此功能的一些链接:

试试这个:

<button type="button" data-bind='enable: $root.people().length > 1, click: $root.removePerson'>Delete</button>

实际上我在 fiddle 中收到了您的代码 运行。我改变的第一件事是两个 > 你忘记在你的 html 代码中:

   <input type="text" data-bind="value: name"></input>
   <input type="text" data-bind="value: company"></input>

然后我添加了一个空对象进行测试:

originalPeopleObserved = null;
var peopleViewModel = new ObservedPersonModel(originalPeopleObserved);
ko.applyBindings(peopleViewModel);

并且在 Safari 上我可以按预期使用您的示例。 试试这个 fiddle here