Angular 多选下拉菜单和 lodash countby

Question

我在这一方面有点空白，我似乎无法完全弄清楚。

所以我有一个简单的 HTML select => 选项元素，它是从后端填充的（不是很相关）

我的问题是这样的：

假设我有一个这样的预制对象：

{
    keyName1: 450,
    keyName2: 800,
    keyName3: 300
}

我想要做的是检查键名是否与我的多选下拉列表中的选项值的名称匹配（值来自数组，在选项上使用'ng-repeat'），如果选项值与键匹配，将数值添加到某种增量变量中，这样我就可以显示找到的 'keyNames' 的总数。

例如 - 如果用户选择“keyName1”，则增量值总计为 450。如果用户选择“keyName1”和“keyName2”，增量值总计为 1,250。

我不知道如何做到这一点 - 现在它只读取下拉列表中的第一项。

这是执行此操作的代码：

_.forEach($scope.widget.instance.settings.serviceContractTypes, function (type) {
     // if item in array matches what is selected in multi-select option
     if(type === $('#contractType:selected').text().trim()) {
        // do stuff
     }
});

希望这一切都有意义，非常感谢您提供的任何指导......

（不用lodash，我就是习惯了）

Answer 1

jQuery 的 :selected 选择器仅适用于 HTML 选项： “ :selected 选择器适用于元素。它不适用于复选框或单选输入；请使用 :checked 。” (https://api.jquery.com/selected-selector/)

你说“我有一个简单的 HTML select => 选项元素，它是从后端填充的（不是很相关）”

这可能是相关的。默认情况下，HTML 选项标签不支持多选；为了支持它，它必须显式地创建为一个选择倍数。您能否分享该选项的 HTML 代码，以明确这是一个问题还是这是一个红鲱鱼？

另外，您能否回显 $scope.widget.instance.settings.serviceContractTypes 并共享以确保它实际上与选项文本中的可用内容相匹配？

附录 - 等等，我想我明白了！

$('#contractType:selected') 选择 #contractType 中所有选定的选项并将它们连接起来。然后 $('#contractType:selected').text().trim() 将其修剪到第一个单词，这只是第一个选择的选项。您应该执行类似 $('#contractType:selected').text().split(" ") 之类的操作，然后检查每种类型是否在结果列表中。