knockout.js为<select>和<option>绑定不同文本
提问于 2013-10-25 02:28:07
在某种程度上，是否可以将我的选择(元素中出现的文本)与我的选项文本分开，以便我可以修剪它并以更好看的方式返回。
例如，在这个杰斯宾中，我希望在显示为选定元素时，修剪所选的项并在末尾添加三个点(已经用CSS尝试过了，但由于浏览器的不同，我放弃了)。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-10-25 02:41:01
您可以使用计算来创建一个包装器对象，该对象可以修剪您的文本：
var ItemModel = function(value){
var self = this;
self.value = ko.observable(value);
self.text = ko.computed(function(){
val = self.value();
if (val.length > 15){
return val.substring(0, 15) + "...";
}
return val;
});
};添加使用它而不是普通的js对象：
self.listOptions = ko.observableArray([
new ItemModel('Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci'),
new ItemModel('Neque porro quisquam est qui dolorem ipsum'),
new ItemModel('Proin ultrices, tellus id placerat congue, neque justo commodo purus, et pulvinar massa')
]);此外，还需要修改绑定，以便为value和text使用不同的属性。
<select data-bind="foreach: listOptions, value: selectedValue, attr: {title : selectedValue}" >
<option data-bind="text: text, value: value"></option>
</select>下面是工作jsbin：http://jsbin.com/oFIdAXO/3/edit
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19587338
复制相关文章
腾讯云开发者
