初始值 dropdownlist Knockout答案

【问题标题】：Initial value dropdownlist Knockout初始值 dropdownlist Knockout
【发布时间】：2021-03-10 03:55:13
【问题描述】：

我有以下代码：

<div class="form-group">
                @Html.LabelFor(model => model.Author, htmlAttributes:
                    new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    <select data-bind="options: book.authors,
                       optionsText: function(item) { return item.firstName + ' ' +  item.lastName; },
                       value: book.author"></select>

                    @Html.ValidationMessageFor(model => model.Author, "",
                        new {@class = "text-danger"})
                </div>
            </div>

视图模型定义如下：

function BookFormViewModel(bookviewmodel) {
    var self = this;
    self.saveCompleted = ko.observable(false);
    self.sending = ko.observable(false);
    self.isCreating = bookviewmodel.id == 0;
    self.book = {
        id: bookviewmodel.id,
        title: ko.observable(bookviewmodel.title),
        isbn: ko.observable(bookviewmodel.isbn),
        description: ko.observable(bookviewmodel.description),
        synopsis: ko.observable(bookviewmodel.synopsis),
        imageurl: ko.observable(bookviewmodel.imageurl),
        authors: ko.observable(bookviewmodel.authors),
        author: ko.observable(bookviewmodel.author)
    };
.....
}

视图模型是从 .cshtml 文件中的 C# 类构建的，如下所示

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval", "/Scripts/ViewModels/BookFormViewModel.js")
    <script>
        var viewModel = new BookFormViewModel(@Html.HtmlConvertToJson(Model));
        ko.applyBindings(viewModel);
    </script>
}

这是一个下拉列表，我可以通过从现有作者列表中选择来为我拥有的每本书设置作者。新作者作品的设定。我唯一的问题是，当我展示这本书时，下拉列表总是指向第一作者，而与 Book 对象中保存的作者无关。有人可以帮忙吗？

【问题讨论】：

确保在作为bookviewmodel 参数传递给BookFormViewModel 的对象中，bookviewmodel.author 确实包含在bookviewmodel.authors 中。如果它是一个对象（而不仅仅是一个字符串），它必须是相同的对象实例。如果它只是一个拥有相同数据的对象是不够的。另外，我怀疑book.author 不一定是ko.observable。还有一个旁注：做self = this 并进一步使用self 并没有做任何有用的事情。您不妨使用this。
book.author 有什么？那是完整的作者对象还是只是作者的 ID？由于您省略了optionsValue，我假设它具有完整的对象。
book.author 拥有完整的作者对象
从@adiga 开始，我建议从作者列表中找到等效作者，并将 self.book.author 属性分配给找到的作者的值。只是为了让对象引用匹配。
从bookviewmodel.authors 获取作者对象，该对象与当前图书的作者具有相同的id（id 或任何其他唯一标识符）。像var author = bookviewmodel.authors.find(a => a.id === bookviewmodel.author.id) 这样的东西，然后在self.book = { author: ko.observable(author), ..rest of the properties } 里面

标签： javascript c# asp.net knockout.js

【解决方案1】：

最后我使用了以下解决方案：

<select data-bind="options: book.authorsids,
        optionsText: function(item) { 
        var auth = book.authors()[book.authorsids().indexOf(item)];
        return auth.firstName + ' ' + auth.lastName;
        },
        value: book.authorid">
</select>

其中 id 是一个 int。所以我决定在选择中使用简单的数据类型而不是完整的对象。

【讨论】：