Html 如何使用AngularJS筛选复选框

我试图让这三部分的复选框以角度过滤，我在这一点上有点迷茫。以下是我的代码，任何帮助都将不胜感激，因为我已经处理了一天半

var filterMod=angular.module（'angularNav'，[]）
.controller（'angularController'，函数（$scope）{
//样本数据
var标签=[]；
变量程序1={
名称：'按程序'，
特性：[
{name:'By Program'，value:'Financial Inclusion'}，{name:'By Program'，value:'Education and Learning'}，
{name:'By Program'，value:'Youth生计'}，{name:'By Program'，value:'Scholars Program'}，
]
};
变量程序2={
名称：'按地区'，
特性：[
{name:'按地区'，value:'撒哈拉以南非洲'}，{name:'按地区'，value:'贝宁'}，{name:'按地区'，value:'布基纳法索'}，{name:'按地区'，value:'布隆迪'}，
{名称：'按地区'，值：'喀麦隆'}，{名称：'按地区'，值：'Cote dIvoir'}，{名称：'按地区'，值：'刚果民主共和国'}，
{name:'按地区'，value:'吉布提'}，{name:'按地区'，value:'埃塞俄比亚'}，{name:'按地区'，value:'加纳'}，{name:'按地区'，value:'肯尼亚'}，
{name:'按地区'，value:'马达加斯加'}，{name:'按地区'，value:'马拉维'}，{name:'按地区'，value:'毛里求斯'}，{name:'按地区'，value:'莫桑比克'}，
{name:'按地区'，value:'利比里亚'}，{name:'按地区'，value:'卢旺达'}，{name:'按地区'，value:'乌干达'}，{name:'按地区'，value:'塞内加尔'}，
{name:'按地区'，value:'南非'}，{name:'按地区'，value:'坦桑尼亚'}，{name:'按地区'，value:'多哥'}，{name:'按地区'，value:'赞比亚'}，
{name:'按地区'，value:'津巴布韦'}，{name:'按地区'，value:'北非'}，{name:'按地区'，value:'埃及'}，{name:'按地区'，value:'摩洛哥'}，
{name:'按地区'，value:'北美'}，{name:'按地区'，value:'加拿大'}，{name:'按地区'，value:'美利坚合众国'}，
{name:'按地区'，value:'拉丁美洲和加勒比'}，{name:'按地区'，value:'哥伦比亚'}，{name:'按地区'，value:'哥斯达黎加'}，
{name:'按地区'，value:'多米尼加共和国'}，{name:'按地区'，value:'危地马拉'}，{name:'按地区'，value:'洪都拉斯'}，{name:'按地区'，value:'海地'}，
{name:'按地区'，value:'巴拉圭'}，{name:'按地区'，value:'秘鲁'}，{name:'按地区'，value:'亚洲'}，{name:'按地区'，value:'黎巴嫩'}，
{名称：'By Region'，值：'Nepal'}
]
};
变量程序3={
名称：'按主题'，
特性：[
{name:'By Theme'，value:'Agriculture'}，{name:'By Theme'，value:'Women'}，
{姓名：'By Theme'，价值观：'Young People'}，{姓名：'By Theme'，价值观：'Leadership'}，
{name:'By Theme'，value:'Research and Learning'}，{name:'By Theme'，value:'Technology'}
]
};
标签推送（程序1）；
标签推送（程序2）；
标签推送（程序3）；
$scope.Program=标记；
//动态创建复选框过滤器
var过滤器=[]；
_.每个（标签、功能（程序）{
_.each（program.properties，函数（property）{
var existingfilter=..findWhere（过滤器，{name:property.name}）；
如果（！existingfilter）{
变量过滤器={}；
filter.name=property.name；
filter.values=[]；
filter.values.push（{value:property.value}）；
过滤器。推送（过滤器）；
}否则{
var existingoption=u.findWhere（existingfilter.values，{value:property.value}）；
如果（！existingoption）{
existingfilter.values.push（{value:property.value}）；
}
}   
});
});
$scope.Filters=过滤器；
});
filterMod.filter（'dynamicFilter'，函数（）{
返回函数（标签、过滤器类别、范围）{
var筛选=[]；
var programFilters=u0.filter（过滤器类别，函数（fc））{
返回{.any（fc.values，{'IsIncluded'：true}）；
});
_.每个（标签、功能（程序）{
var includeProgram=true；
_.每个（程序过滤器、函数（过滤器）{
var-props=wk.filter（prog.properties，{'name'：filter.name}）；
if（！.any（props，function（prog）{return{.any（filter.values，{'value'：prog.value，'isinclude'：true}）；}））{
includeProgram=false；
}
});
如果（包括程序）{
过滤推送（prog）；
}
});
返回过滤；
};
});

.ng斗篷{
显示：无；
}
托普纳夫先生{
浮动：左；
宽度：400px；
}
.节目{
浮动：左；
宽度：100px；
高度：100px；
利润率：20px；
填充：20px；
文本对齐：居中；
背景色：#eee；
}
.分类{
列表样式：无；
左侧填充：0px；
}
h3{
边缘底部：0px；
}
保险商实验室{
边缘顶部：2倍；
}

导航滤波器
标签过滤器
{{filter.name}


{{option.value}}


{{program.name}

老实说，你做整个事情的方式有点不可靠。但是为了让它与你所拥有的一起工作，你只需要使用这个，而不是在程序中使用你的ng repeat程序

    <div ng-repeat="filterItem in Filters" class="program">
      <div ng-repeat="item in filterItem.values | filter:{IsIncluded:true}">
        {{item.value}}
      </div>
    </div>

{{item.value}}

你能创建一个plunker并指定问题吗？我以前没有使用plunker，所以我认为这是@idioscentic必须将

css/style.css

更改为just

style.css

并将

js/script.js

更改为just

script.js

才能运行你的Plunkr。修正了普朗克。控制台中有更多的错误，因此这可能不是所有感谢您修复的问题，因为我以前没有使用过它。这就是它应该看起来的样子。我的问题是让它过滤并显示结果。我完全被难住了。我不确定我是否理解你在这里试图过滤的是什么。所有数据都已显示在屏幕上。你只是想在所有复选框下面显示选中复选框项目的列表吗？我替换了代码，但没有