我正在使用 KnockoutJS 编写一个小型应用程序,用户可以通过在输入字段中输入文本来编辑“产品”,输入字段将自动更新图像顶部的可视文本框。这允许用户在购买例如牌匾之前预览可雕刻的线条。
所以这是我的问题:
我有一个包含 observableArray (product.lines) 的对象(产品):
self.product = ko.utils.arrayMap(jsonData, function(data) {
return new CustomizableProduct(
data.sku, data.name, data.lines, data.fonts, data.plates)
});
function CustomizableProduct(sku, name, lines, fonts, plates) {
return {
sku: ko.observable(sku),
name: ko.observable(name),
lines: ko.observableArray(lines),
fonts: ko.observableArray(fonts),
plates: ko.observableArray(plates)
}
}
json数据:
var initialData = [
{
"sku": "PMW",
"name": "Premium Genuine Walnut Step Edge Plaque",
"plates": [
{
"sku": "plateSKU",
"name": "plateName",
"img": "/images/plates/plateSKU.jpg"},
{
"sku": "plateSKU2",
"name": "plateName2",
"img": "/images/plates/plateSKU.jpg"}
],
"lines": [
{
"label": "Line 1",
"value": "Line 1",
"type": "input",
"characterLimit": "146"},
{
"label": "Line 2",
"value": "Line 2",
"type": "input",
"characterLimit": "156"},
{
"label": "Line 3",
"value": "Line 3",
"type": "submit",
"characterLimit": "176"}
],
"fonts": [
{
"font": "Times New Roman"}
]}
];
product.lines 循环并使用从对象设置的默认值(值:$data.value)创建输入框。这些输入框可由用户编辑。我还需要将输入框的值显示为其更新后的类型,以充当正在键入的内容的预览。当我输入新单词时,它会在对象中更新,但需要显示值的字段不会更新。
我的代码在这里有一个 jsFiddle:http://jsfiddle.net/pR6xp/2/
当通过编辑输入字段更新该值时,我需要编写什么才能更新该值?
谢谢..
最佳答案
您创建了一个由线组成的 observableArray,但是当将对象添加到 observableArray 时,它们的属性不会变得可观察,这由您来实现。
我添加了一个具有可观察值的 ProductLine 对象,并使用这些对象初始化了lines集合。
希望这有帮助。
关于jquery - knockoutjs - 具有可见可观察值的对象的 observableArray,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10220637/