我是 Knockout.js 的新手,但我已经成功地将一些与简单 WebAPI 服务交互的 CRUD 模板组合在一起。现在我想继续研究更复杂的结构,并且我已经被一种相当常见的情况绊倒了:单个 html 表单上的多个下拉列表。
我知道我可以构建一个像这样的 ViewModel:
function myViewModel() {
var self = this;
self.selectedCustomer = ko.observable();
self.customers = ko.observableArray([]);
self.selectedState = ko.observable();
self.states = ko.observableArray([]);
self.selectedProduct = ko.observable();
self.products = ko.observableArray([]);
}
然后我将每个选择列表绑定(bind)到适当的属性。虽然这应该可行,但我觉得有更好的方法来处理它。我考虑过将每个列表分解成它自己的 ViewModel,但这似乎有点过分了。我想尽早养成良好的 MVVM 习惯,并希望使用这些新技术重建旧系统,所以任何方向都会很好。
最佳答案
实际上你要找的现在叫Component
在 knockoutjs 版本 3.2.0 中。要了解这一点,您可以查看 knockoutjs 创始人 Steve Anderson 的演讲。
Architecting large Single Page Applications with Knockout.js
此演示文稿告诉我们创建一个基于两件事的组件。
- View 模型
- 模板
那么有两种使用方式。
1.HTML标签方式。示例 <name-editor></name-editor>
2 使用组件绑定(bind) <div data-bind="component: 'name-editor'"></div>
要记住的一件事是,组件将是完全独立的,您可以根据需要在页面上调用任意数量的组件实例,每个实例都将独立工作。
这里有两个教程将引导您走上正确的道路。
关于javascript - 在一个 ViewModel 中绑定(bind)多个 ObservableArrays 的 Knockout.js 最佳实践,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24897754/