0

ビューモデルの作成にはマッピング プラグインを使用します。Chrome からのウォッチャー出力は次のとおりです。

viewModel: Object
 Id: function observable() 
 Language: function observable() 
 QuoteListViewModel: Object
 QuoteSelectedViewModel: Object

MVC モデルは次のとおりです。

public class QuoteRequestViewModel
{
    public Guid Id { get; set; }
    public LanguageEnum Language { get; set; }   

    public QuoteViewModel QuoteSelectedViewModel { get; set; }
    public QuoteListViewModel QuoteListViewModel { get; set; }
}

QuoteViewModel は次のとおりです。

public class QuoteViewModel
{
    public string ProductName { get; set; }
    public decimal MonthPrice { get; set; }
    public decimal QuarterPrice { get; set; }
    public decimal BiannualPrice { get; set; }
    public decimal YearPrice { get; set; }

    public List<CoverQuoteViewModel> CoverQuotesViewModel { get; set; }
}

QuoteListViewModel はここでは関係なく、実際には正常に動作します。

2 つの質問:

1) QuoteSelectedViewModel が Observable 関数ではなく Object としてマップされるのはなぜですか? QuoteListViewModel は配列であるため、その理由は理解できますが、QuoteSelectedViewModel は配列ではありません。

2) DOM を QuoteSelectedViewModel にバインドできません。これが私がすることです：

viewModel.customizeQuote = function () {
  viewModel.QuoteSelectedViewModel = this;
}

そして、customizeQuote がそこで呼び出されます。

<table data-bind="with: QuoteListViewModel">
 <tbody>
 <tr data-bind="foreach: Quotes">
  <td>
    <a class="btn btn-primary" href="#" data-bind="click: $root.customizeQuote">Customize</a>
 </td>
 </tr>

デバッグすると、QuoteSelectedViewModel に QuoteListViewModel 配列からの正しい Quote が含まれていることがわかります。ただし、次のことを行います。

viewModel.QuoteSelectedViewModel = this;

私には間違っているようです。それは観察可能であるべきであり、私はすべきです

viewModel.QuoteSelectedViewModel( this );

何が問題なのですか？

[編集]

QuoteSelectedViewModel が観察可能でないという事実は、明らかに問題の根源です。

次のコードを追加しました。

viewModel.SelectedQuote = ko.observable(viewModel.QuoteSelectedViewModel);

そしてcustomizeメソッドでは、代わりにこれを行います:

viewModel.SelectedQuote(this);

これで、リストがバインドされました。では、マッピング プラグインを使用するときに、最初から QuoteSelectedViewModel を監視可能なオブジェクトにするにはどうすればよいでしょうか。

4

1 に答える 1

1

マッピングプラグインは、最低レベルのプロパティと配列のオブザーバブルを作成します。ネストされたオブジェクトの場合、親を監視可能にすることはありません。

var test = {
   sub: {
       name: "Bob"
   }
};

この場合、それは観察可能になりますがname、観察可能でsubはありません。

1つのオプションは、ここで説明するように、マッピングオプションを使用してオブジェクトを作成する方法をカスタマイズすることです。

于 2013-03-13T13:30:10.337 に答える