Question

我已经尝试了大多数SO答案，用于识别angular.js中的唯一值（我是新手），但我的问题是尝试将这些值转换为选择形式，并且要对数据中的数据进行过滤表

本质上我有一些数据，我想在表中显示它，并且在表头中有一个选择的数据列中的唯一值下拉列表，并能够过滤由所选值显示的表。

我正在尝试使用

app.filter('unique', function () {
return function ( collection, keyname) {
var output = [],
    keys = []
    found = [];

if (!keyname) {

    angular.forEach(collection, function (row) {
        var is_found = false;
        angular.forEach(found, function (foundRow) {

            if (foundRow == row) {
                is_found = true;                            
            }
        });

        if (is_found) { return; }
        found.push(row);
        output.push(row);

    });
}
else {

    angular.forEach(collection, function (row) {
        var item = row[keyname];
        if (item === null || item === undefined) return;
        if (keys.indexOf(item) === -1) {
            keys.push(item);
            output.push(row);
        }
    });
}

return output;
};
});

我的html看起来像这样

    <th> Number:        
    <br/>
     <select ng-model="search.number"  
             ng-options="row.numberfor row in data | unique:'number'">
    <option value=""> </option>
    </select>
    </th>

然后是表数据本身

        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="r in data | filter:{ number: search.number,  }">
        <td> {{r.number}}</td>
        </tr>
        </tbody>
        </table>

输出生成了这个，但是没有正确设置值，因此过滤不返回任何内容（因为0,1,2,3 ..没有匹配的数据行）。

<select ng-model="search.number" 
ng-options="row.numberfor row in data | unique:'number'"  
class="ng-pristine ng-valid">
<option value="" class=""> </option>
<option value="0">1023 456789</option>
<option value="1">1024 456789</option>
<option value="2">1025 456789</option>
<option value="3">1023 111999</option>
<option value="4">1024 111999</option>
</select>

我也尝试过这个独特的功能

/*          
app.filter('unique', function() {
return function(input, key) {
    var unique = {};
    var uniqueList = [];
    for(var i = 0; i < input.length; i++){
        if(typeof unique[input[i][key]] == "undefined"){
            unique[input[i][key]] = "";
            uniqueList.push(input[i][key]);
        }
    }
    return uniqueList;
};
}); */

但没有快乐。我必须将[key]添加到此行uniqueList.push(input[i][key]);只是为了获取下拉列表中显示的值，但我似乎无法控制该下拉列表中的选项值。

我的控制台没有错误。

我有10个列/字段要进行过滤，但我在这里只提供了一个示例。

有人可以帮助我指出正确的方向。感谢

编辑：

我看到这个指令可能有用，但是当map key-＆gt;值相同时，是否有更快/更简单的方法？

app.directive('mySelect', [function () {
  return {
    restrict: 'E',
    transclude: true,
    replace: true,
    template: '<select ng-options="key as value for (key, value) in myMap" ng-transclude></select>',
    link: function postLink(scope, element) {
      scope.myMap = {"1":"1","2":"2","3":"3"}; 
   // e.g. hashmap from server
    }
};

Answer 1

证明这是有效的

<select ng-model="search.<?php echo $column; ?>" 
        ng-options="v for (k, v) in data 
                | orderBy:'<?php echo $column;?>' 
                | unique:'<?php echo $column;?>' ">
        <option value="">select</option>
</select>

卡在查看CSV文件中每列的foreach中。

即。传入任何csv的完整excel样式过滤。

angular js过滤/搜索和唯一选择

1 个答案: