Javascript 如何使用angular ui select筛选两个字段中的数据？

我有一个angular应用程序，使用ui select，页面上有两个带有多个选择器的输入字段，它们都是下拉列表。一切正常。当我在第一个字段（在本例中是它的编程语言）中选择一个选项时，第二个字段（属于特定编程语言的框架）必须被过滤，并且只显示正确框架的列表

工作代码：

<div class="col-md-2 col-md-offset-2">
                    <ui-select  multiple ng-model="newdeveloper.langs">
                        <ui-select-match placeholder="Select skills">[[ $item.lang_name ]]</ui-select-match>
                        <ui-select-choices repeat="item in (allSkillList.langs | filter: $select.search) track by item.id">
                            <span ng-bind="item.lang_name"></span>
                        </ui-select-choices>
                    </ui-select>
                </div>
                <div class="col-md-2">
                    <ui-select  multiple ng-model="newdeveloper.frameworks">
                        <ui-select-match placeholder="Select frame">[[ $item.frame_name ]]</ui-select-match>
                        <ui-select-choices repeat="item in (allSkillList.frameworks | filter: $select.search) track by item.id">
                            <span ng-bind="item.frame_name"></span>
                        </ui-select-choices>
                    </ui-select>
                </div>

{
"frameworks": [
    {
        "id": 1,
        "frame_name": "Django",
        "frame_lang": 1
    },
    {
        "id": 2,
        "frame_name": "jQuery",
        "frame_lang": 2
    },
    {
        "id": 3,
        "frame_name": "Spring",
        "frame_lang": 3
    }
],
 "langs": [
    {
        "id": 1,
        "lang_name": "Python"
    },
    {
        "id": 2,
        "lang_name": "JavaScript"
    },
    {
        "id": 3,
        "lang_name": "Java"
    },
 ]

}

“frameworks.framework_lang”必须与“langs.id”匹配，以使过滤器正常工作

问题：

我如何解决这个问题？我应该使用一些自定义过滤器吗

---

谢谢大家!

您必须创建一个自定义过滤器

filterbyland

，然后将其应用于框架

angular.module('demoApp').filter('filterByLang',function(){
    return function(frameworks,langs){
        var filtered = [];
        if(langs && langs.length){
            angular.forEach(frameworks,function(framework){
                angular.forEach(langs,function(lang){
                    if(framework.frame_lang == lang){
                        filtered.push(framework);
                    }
                })    
            });
        }
        return filtered;
    };
});

在html内部，通过更新第二个下拉代码

---

…

它的工作非常出色，非常感谢您的帮助。

<ui-select-choices repeat="item in (allSkillList.frameworks | filterByLang: newdeveloper.langs | filter: $select.search) track by item.id">