基于复选框选择的AngularJS过滤器

时间:2018-09-12 17:25:28

标签: javascript html angularjs json filtering

我创建了一个函数,该函数应该根据复选框的选择来过滤显示的数据。但是,我无法显示正确的数据。复选框可以正常工作,但是我无法将所选的复选框值推入数据并获取输出。

enter image description here

我需要选中复选框以显示包含该H值的数据。

enter image description here

因此,基本上有4个与您在上面的屏幕截图中看到的type字段关联的复选框。假设我选择了H。我只需要显示type = H的数据。我将在到目前为止的内容下面附加一些代码。我似乎无法正常工作。

var filterOtb = function (keepOpen, types) {
var filtered = data;
var checkedTypes = [];

console.log('filtered = ', filtered);

scope.types.forEach(function(code) {
 if (code.selected) {
  checkedTypes.push(code.type);
  console.log('selected checkbox', checkedTypes);
 }
});

if (scope.validDates.from) {
 filtered = filterOtbByDateRange();
}

if (modal && !keepOpen) {
 modal.hide();
}
return filtered;

}

其中运行着一个单独的功能,可按日期过滤屏幕快照中显示的键。请忽略该功能...感谢您的帮助,因为我已经坚持了好几天...

2 个答案:

答案 0 :(得分:0)

使用下划线非常简单,您可以为一个或多个属性传递过滤器值。

let listOfPlays = 
    [
    {title: "The Rambo", author: "Shakespeare", year: 1520},
    {title: "Cymbeline", author: "Shakespeare", year: 1611},
    {title: "The Tempest", author: "Shakespeare", year: 1611},
    {title: "The Dog", author: "Shakespeare", year: 1900}
    ]


_.where(listOfPlays, {author: "Shakespeare", year: 1611});
=> [{title: "Cymbeline", author: "Shakespeare", year: 1611},
    {title: "The Tempest", author: "Shakespeare", year: 1611}]

答案 1 :(得分:0)

检查此代码以获取过滤器数组;

DEVNULL = open(os.devnull, 'wb')
radiostream = subprocess.Popen(["mplayer", 'http://edge-bauerabsolute-02-gos1.sharp-stream.com/absolute90s.mp3?&'], shell = False, stdout=DEVNULL, stderr=DEVNULL)

 var data = [{ id: '1', type: 'H' }, { id: '2', type: 'H' }, { id: '3', type: 'M' }, { id: '4', type: 'G' }, { id: '5', type: 'J' }, { id: '6', type: 'G' }];
    var types = ['H', 'G'];  

    var filter = function (data, types) {
        return data.filter(item => types.includes(item.type));
    }
    console.log(filter(data, types));