我正在尝试使用 KnockOut 映射插件创建 View 模型,
这是对象,基本上下面是一个带有单词的句子。
var data = {
name: 'Example Title',
sentences: [
{id: 1, words: [{text: 'word1'}, {text: 'word2'}]},
{id: 2, words: [{text: 'word3'}, {text: 'word4'}]}
]};
我想要三个 View 模型,
文章应该包含句子,句子应该包含单词
var ArticleViewModel = function(data)
{
var self = this;
self.id = ko.observable(data.id);
self.sentences = ko.observableArray([]);
}
var SentenceViewModel = function(data)
{
var self = this;
self.id = ko.observable(data.id);
self.words = ko.observableArray([]);
}
var WordViewModel = function(data)
{
var self = this;
self.id = ko.observable(data.id);
self.text = ko.observable(data.text);
}
我想把它放在下面的 View 中;
<p data-bind="foreach:sentences">
<span data-bind="foreach:words">
<span data-bind="text:text">
</span>
</p>
我什至不确定我想要实现的目标是否可行,但我想我需要映射,但我无法完成这项工作,
这是我的一些尝试,也许会有助于更好地理解我的问题, http://jsfiddle.net/sureyyauslu/2wTjy/6/
提前非常感谢...
最佳答案
问题是你有一个 p 标签嵌套在另一个标签中。模板引擎无法解析此错误标记。
当我认为你想要另一个 foreach 时,你也在使用 with 绑定(bind)。
<p data-bind="foreach:sentences">
<span data-bind="text:id"></span>
<span data-bind="foreach:words">
<span data-bind="text:text"></span>
</span>
</p>
最后可以将句子模型简化为
var mySentenceModel = function(data) {
var self = this;
ko.mapping.fromJS(data, wordMapping, self);
}
您不需要定义 id 等,因为这一切都由映射插件处理。
http://jsfiddle.net/madcapnmckay/6hMA3/
希望这会有所帮助。
关于knockout.js - KnockOut 映射分层 JS 对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9575267/