0

私はこのパターンに何度か遭遇しましたが、それを処理するためのエレガントな方法を見つけられませんでした。読み取り専用および編集モードでページを設定しようとしています。

これがhtmlです:

<div>
    <span data-bind="text: EventType, if: !EditMode()"></span>
    <select data-bind="options: $root.EventTypes, optionsValue: 'Id', 
        optionsText: 'Name', value: EventType, if: EditMode()"></select>
</div>
<div>
    <a href="#" data-bind="click: edit">Edit</a>
</div>

そしてjavascript:

function viewModel(eventJSON) {
    var self = this;

    self.EventType = ko.observable(eventJSON.EventType);
    self.EventTypes = ko.observableArray([]);

    self.edit = function() {
        $.getJSON("url...", function(eventTypesJSON) {
            self.EventTypes(eventTypesJSON);
        }
    }
}

データバインディングでタイミングの問題が発生しています。applyBindingsが呼び出されると、スパンが正しく設定されます。ただし、編集モードに入ると、ドロップダウンリストが選択した値に設定されず、EventTypeが未定義に設定されます。

これが私が起こっていると思うことです:

  1. ユーザーが[編集]ボタンをクリックすると、ajax呼び出しが行われてEventTypeが取得されます。
  2. 選択はデータバインドされています。EventTypes配列が空であるため、EventTypeはnullに設定されます。
  3. ajax呼び出しが完了し、EventTypesにデータが入力されます。
  4. EventTypeは以前にnullに設定されていたため、ドロップダウンの最初の項目が選択されます。(たとえば、元のEvenType値は失われます。)

私がしたいこと:

  1. ユーザーが[編集]ボタンをクリックすると、ajax呼び出しが行われてEventTypeが取得されます。
  2. ajax呼び出しが完了し、EventTypes配列にデータが入力されます。
  3. 選択はデータバインドされており、リスト内の正しい項目が選択されています。
4

2 に答える 2

2

今日も同じ問題があり、その解決策を見つけたと思います:

  • SELECT は、監視可能な配列からオプションの値とテキストを取得します。
  • 監視可能な配列のデータは、ビュー モデルの残りの部分が埋めら​​れた後に読み込まれます。
  • 配列の選択された値は、ビュー モデルの別のフィールドから取得されます。

選択した値を、Web サービス呼び出しから配列をロードする関数に渡すことで、機能させることができました。呼び出しが完了したら、選択した値として最初に使用されたオブザーバブルに値を割り当てます。そうすることで、そのフィールドへのサブスクライバーが強制的に再バインドされるため、現在入力されている SELECT が選択された値を正しく変更します。

これはあなたにとって遅いことであり、あなたの状況とまったく同じではないかもしれませんが、似ているように聞こえ、他の誰かを助けるかもしれません.

于 2014-01-09T20:40:40.573 に答える
1

EventTypes配列を空に設定する代わりに、最初に選択されたイベント タイプでブートストラップして、選択が有効になっているときにEventType値をクリアしないようにします。呼び出しから ajax が戻ると、コンテンツはとにかく上書きされます。すなわち:

self.EventTypes = ko.observableArray([eventJSON.EventType]);

または、何らかの理由で事前に配列を初期化できず、最初のイベントがまだ ajax コールバックのスコープ内にあるため、配列をロードした直後にEventTypeをリセットするだけです。

$.getJSON("url...", function(eventTypesJSON) {
   self.EventTypes(eventTypesJSON);
   self.EventType(eventJson.EventType);
}

後者では、最初のビュー モデル パラメータと ajax コールバックの名前に同じ名前を使用しないように注意してください。そうしないと、後者が最初のパラメータを上書きします。

于 2013-03-07T22:14:35.827 に答える