使用 Knockout.js 对 Select2 的标记支持

Posted 2023-05-07

【中文标题】使用 Knockout.js 对 Select2 的标记支持

【英文标题】：Tagging support for Select2 with Knockout.js

【发布时间】：2012-09-28 00:22:50

【问题描述】：

在尝试将Knockout.js 与Select2 集成时，我注意到似乎the usual way 的做法似乎没有tagging support。

a jsFiddle 说明了基本支持，但不清楚如何将其扩展到 Select2 的标记支持。

我已将其简化为更简洁的 jsFiddle example，人们期望它会成为解决方案的基础。

我将不胜感激有关如何使用 Knockout.js 获得对 Select2 的标记支持的想法和建议。

注意：我没有嫁给Select2，尽管我认为它很棒。但是，如果有一个替代建议可以很好地与Knockout.js 一起使用标记支持，我会很想听听它。话虽如此，我认为Select2 问题的解决方案会很有趣。

【问题讨论】：

顺便说一句，似乎所有“以通常方式”的示例都是针对<select> 标签的，但标签支持需要<input> 标签。这在一定程度上改变了分析。我会发布任何进展。

【参考方案1】：

如您所述，标记功能不适用于 <select> 元素。那是因为它允许用户添加不在列表中的标签。您可以在该字段中输入任何内容并按 Enter 键，它会添加到值中。

这是一个工作示例：http://jsfiddle.net/mbest/6XvqX/41/

关键变化：

可用项目列表通过tags 选项直接传递给Select2。 使用value 绑定而不是selectedOptions，因为后者仅适用于<select> 元素。 计算用于将所选项目作为数组获取。

【参考方案2】：

我已经用更新版本的 knockout.js 更新了提琴手，因为我无法让上面的示例正常工作。这个可以解决问题：http://jsfiddle.net/6XvqX/424/。

(no change to the code itself)

无论如何，感谢 Michael 提供的解决方案。 :)