2

私はKnockoutJSを使用して、ユーザーが画像の上に表示可能なテキストボックスを自動的に更新する入力フィールドにテキストを入力することで、「製品」を編集できる小さなアプリケーションを作成しています。これにより、ユーザーは、たとえばプラークを購入する前に、刻印可能な線をプレビューできます。

だからここに私の問題があります：

observableArray（product.lines）を保持するオブジェクト（product）があります：

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)
  }
}

jsonData：

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/

入力フィールドを編集して更新されたときにその値を更新するには、何を書く必要がありますか？

ありがとう..

4

1 に答える 1

2

行のobservableArrayを作成しますが、オブジェクトがobservableArrayに追加された場合、それらのプロパティはobservableになりません。これは、実装する必要があります。

監視可能な値を持つProductLineオブジェクトを追加し、これらのオブジェクトを使用して行コレクションを初期化しました。

http://jsfiddle.net/vRBhP/1/

お役に立てれば。

于 2012-04-19T03:09:25.273 に答える