2

ネストされた配列に対してバインディングを機能させるのに問題があります。ページが最初に読み込まれたときに値が正しく表示されていますが、編集すると、バインドされたオブジェクトが更新されません。

ここでjsfiddleを作成しました：http：//jsfiddle.net/coverbeck/qCzT6/1/。

私のHTMLはこれです：

<body>
    <ul>
<!-- ko foreach: {data: cities, as: 'city'} -->
        <li>
           <input data-bind="value: city.name"/>
           <span data-bind="text: city.name"></span>
        </li>
    <ul>
    <!-- ko foreach: {data: neighborhoods, as: 'neighborhood'} -->
        <li>
            <input data-bind="value: neighborhood"/>
            <span data-bind="text: neighborhood"></span>
        </li>
    <!-- /ko -->
    </ul>
<!-- /ko -->
</ul>
</body>

そして私のJavaScriptは：

var sf = {name: ko.observable('San Francisco'),
          neighborhoods: ko.observableArray([
                ko.observable('Haight'), 
                ko.observable('Bayview'), 
                ko.observable('Marina')
           ])
         }; 
var ny = {name: ko.observable('New York'),
          neighborhoods: ko.observableArray([
                ko.observable('Hells Kitchen'), 
                ko.observable('Times Square')
            ])
          };

var cities = ko.observableArray([sf, ny]);
var viewModel = { cities: cities };
ko.applyBindings(viewModel);

都市名を変更すると、対応するスパン要素が更新されます。ネイバーフッド名を変更すると、対応するスパン要素が更新されません。

私はすでにここで同様の質問をしました、そして答えはうまくいきました。今回は問題が発生しているネストされた配列であることを除いて、同じ問題が繰り返し発生しているようです。ネストされた配列に対してその回答から修正を試みましたが、この場合は違いがないようです。

ありがとう、

チャールズ

4

1 に答える 1

2

問題がどこから来ているのか正確にはわかりませんが、次のように解決できます。

var ny = {name: ko.observable('New York'), 
          neighborhoods: ko.observableArray([
              new neighborhood('Hells Kitchen'), 
              new neighborhood('Times Square')])};

function neighborhood(name) {
    this.name = ko.observable(name);
}

次に、foreachneighborhoodsをバインドしてから、にバインドしnameます。問題は、名前のないオブザーバブルが気に入らないということかもしれません。

ここで働くフィドル

于 2013-03-19T15:48:46.913 に答える