剔除绑定到 Select optionsText 以获取 fullName答案

【问题标题】：Knockout binding to Select optionsText to get fullName剔除绑定到 Select optionsText 以获取 fullName
【发布时间】：2016-07-21 06:23:08
【问题描述】：

问题是关于 optionsText 绑定以获取 fullName。

JsFiddle

当我这样做时，它可以工作as in Knockout doc，

<select multiple="multiple" width="50" data-bind="options: leftItems,optionsText: function(item) {return item.firstName() + ' ' + item.lastName() }, selectedOptions:leftSelectedItems"></select>

但是当我将功能移动到视图模型并尝试使用它时不起作用，

这是我的选择，

<select multiple="multiple" width="50" data-bind="options: leftItems,optionsText: returnFullName(item), selectedOptions:leftSelectedItems"></select>

在我的视图模型中，

    self.returnFullName = function(item) {
        console.log("self.returnFullName called.");
        console.log(item);
        return item.firstName() + ' ' + item.lastName();
    };

我得到的错误是“Uncaught ReferenceError: Unable to process binding “options: function (){return leftItems}”，这甚至与 optionText 无关。

我错过了什么吗？

【问题讨论】：

你得到的实际错误是：Uncaught ReferenceError: Unable to process binding "options: function (){return names }" Message: item is not defined
这能回答你的问题吗？ Setting a combined optionsText in knockout.js

标签： knockout.js

【解决方案1】：

你不需要像你一样传递它。但是您可以采用这些方法中的任何一种。

方法1

您可以只调用 viewmodel 函数，第一个参数将隐含 $data 参数。

<select multiple="multiple" width="150" data-bind="options: names,optionsText: returnFullName"></select>

在虚拟机中

 self.returnFullName = function(item) {
     console.log(item);
        return item.firstName + " " + item.lastName;

    };

Jsfiddle:-

http://jsfiddle.net/mtfv6q6a/10/

方法二

绑定 $data 并照常传递。

<select multiple="multiple" width="150" data-bind="options: names,optionsText:returnFullName.bind($data);"></select>

Jsfiddle:-

http://jsfiddle.net/mtfv6q6a/42/

方法3：-

你可以把它包装在一个函数调用中，然后像这样调用：-

<select multiple="multiple" width="150" data-bind="options: names,optionsText:function(data){ return returnFullName(data);}"></select>

Jsfiddle:-

http://jsfiddle.net/mtfv6q6a/51/

【讨论】：