Question

我有一天的淘汰赛。这是我简化的VM：

function UserRecruitingViewModel(apiBaseUrl, userId) {
    var self = this;
    self.orgs = ko.observableArray();
    //ddl org view switcher stuff
    self.orgDdl = ko.observableArray();
    self.selectedOrg = ko.observable();
    var DropdownOrg = function (name, orgId) {
        this.name = name;
        this.orgId = orgId;
    };
    //...snip ajax get to pull data...//
}

注意我在那里有这一行：

self.selectedOrg = ko.observable();

在我的页面上，我有这个下拉列表：

<select 
data-bind="options: $root.orgDdl, optionsText: 'name', optionsValue: $root.selectedOrg">
</select>

为便于阅读，数据绑定值：

data-bind="
    options: $root.orgDdl, 
    optionsText: 'name', 
    optionsValue: $root.selectedOrg"

这不起作用。如果我的选择元素如没有那里的optionsValue绑定，它将使用我从GET请求获得的值绑定列表。

我在控制台中收到错误消息：

Unable to process binding "text: function (){return selectedOrg() }"
Message: selectedOrg is not defined

我很困惑，因为我的VM上有selectedOrg observable设置。

Answer 1

如果 selectedOrg 是要获取选定选项的对象，请在我的示例中使用 selectedOption 。

视图模型

var optionModel = function(id,name){
    var self = this;
    self.id = id;
    self.name = name;
}

var viewModel = function(){
    var self = this;
    self.options = [
        new optionModel(1,"First"),
        new optionModel(2,"Second")
    ];
   self.selectedOptionId = ko.observable(0);
   self.selectedOption = ko.computed(function(){
        return ko.utils.arrayFirst(self.options, function(item){
            return item.id === self.selectedOptionId();
        });
    });
}

ko.applyBindings(new viewModel());

HTML绑定

<select data-bind="options: options, 
                   optionsText: 'name',
                   optionsValue: 'id', 
                   value: selectedOptionId,
                   optionsCaption:'Choose.....'">
</select>

以上代码适用于与knockout绑定的简单选项。对于这个问题，模型没有很好地定义，你使用optionsValue的原因并不清楚。

Here is sample jsfiddle for reference（基于样本选项模型的样本，因为您的问题不明确）

Answer 2

您希望绑定中只有value，而不是optionsValue。 value指定observable获取选择结果的内容;如果您希望将optionsValue设置为对象的一个特定属性而不是对象本身，则使用value。假设您希望selectedOrg()包含您选择的整个DropdownOrg对象，则不需要optionsValue。

淘汰赛中的selectedValue没有约束力

2 个答案: