Question

我使用映射插件来创建视图模型。以下是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在这里不相关，实际上工作正常。

两个问题：

1）为什么QuoteSelectedViewModel被映射为Object而不是Observable函数？我理解为什么它是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数组的正确引用。无论如何：

viewModel.QuoteSelectedViewModel = this;

对我来说似乎不对。它应该是一个可观察的，我应该做

viewModel.QuoteSelectedViewModel( this );

知道什么是错的吗？

[编辑]

QuoteSelectedViewModel不可观察的事实显然是问题的根源。

我添加了以下代码：

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

并在自定义方法中我这样做：

viewModel.SelectedQuote(this);

现在，列表已绑定。那么当我使用映射插件时，如何从一开始就使QuoteSelectedViewModel成为一个可观察对象？

Answer 1

映射插件为最低级别的属性和数组创建可观察对象。对于嵌套对象，它不会使父对象成为可观察对象。

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

在这种情况下，它会使name成为可观察对象，但sub将无法观察到。

一个选项是使用映射选项自定义对象的创建方式，如here所述。

淘汰赛绑定问题

1 个答案: