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