角度ng-repeat按数字过滤

时间:2022-08-25 09:48:35

I'm having some trouble filtering an list by type (number) in angular (1.5.8)

我在按角度(1.5.8)的类型(数字)过滤列表时遇到一些问题

my ng repeat with filter is as following:

我的重复过滤器如下:

ng-repeat="activity in guild.history_updates | filter : {
    action_type: filters.action_type,
    user_id: filters.user,
}"

and my filter

和我的过滤器

<md-input-container class="md-block">
    <label>Type</label>
    <md-select ng-model="filters.action_type">
        <md-option>
            All
        </md-option>
        <md-option ng-repeat="action_type in guildActivityCtrl.action_types"
            ng-value="action_type.type">
            {{action_type.name}} ({{ action_type.type }})
        </md-option>
    </md-select>
</md-input-container>

When I'm filtering on action_type 1 I'm also getting action types 10

当我在action_type 1上过滤时,我也得到了动作类型10

角度ng-repeat按数字过滤 角度ng-repeat按数字过滤

But when I chage the filter to 10, I'm getting the right results

但是当我将过滤器变为10时,我得到了正确的结果

角度ng-repeat按数字过滤 角度ng-repeat按数字过滤

Every other action type is filtered good as well (e.g. action_type 3)

其他所有操作类型也都已过滤良好(例如action_type 3)

角度ng-repeat按数字过滤 角度ng-repeat按数字过滤

2 个解决方案

#1


3  

ng-repeat="activity in guild.history_updates | filter:{action_type:filters.action_type,user_id: filters.user}:true"

Adding ":true" after your filter should change this to a strict equality check, now comparing the numeric values.

在过滤器后添加“:true”应该将其更改为严格的相等性检查,现在比较数值。

Hope this helps.

希望这可以帮助。

https://docs.angularjs.org/api/ng/filter/filter

https://docs.angularjs.org/api/ng/filter/filter

The Arguments section defines the comparator.

Arguments部分定义了比较器。

#2


1  

Like Neal Hamilton said, we need to add :true to add a strict equality check.

就像Neal Hamilton所说,我们需要添加:true来添加严格的相等检查。

Adding :true won't work when the output of the md-select isn't a number so we can add a filter to parse the output to a number like:

添加:当md-select的输出不是数字时,true将不起作用,因此我们可以添加一个过滤器来将输出解析为如下数字:

.filter('parseInt', function() {
    return function(number) {
        if(!number) {
            return false;
        }
        return parseInt(number , 10);
    };
})

We can add this filter to the ng-repeats' filter like:

我们可以将此过滤器添加到ng-repeats的过滤器中,如:

ng-repeat="activity in guild.history_updates | filter : {
    action_type: (filters.action_type | parseInt ),
    user_id: filters.user,
} : true"

Edit: When you don't want to strict check every value in the filters you can use multiple filters like:

编辑:当您不想严格检查过滤器中的每个值时,您可以使用多个过滤器,如:

ng-repeat="activity in guild.history_updates
| filter : {
    action_type: (filters.action_type | parseInt ),

} : true
| filter: {
    user_id: filters.user
}"

#1


3  

ng-repeat="activity in guild.history_updates | filter:{action_type:filters.action_type,user_id: filters.user}:true"

Adding ":true" after your filter should change this to a strict equality check, now comparing the numeric values.

在过滤器后添加“:true”应该将其更改为严格的相等性检查,现在比较数值。

Hope this helps.

希望这可以帮助。

https://docs.angularjs.org/api/ng/filter/filter

https://docs.angularjs.org/api/ng/filter/filter

The Arguments section defines the comparator.

Arguments部分定义了比较器。

#2


1  

Like Neal Hamilton said, we need to add :true to add a strict equality check.

就像Neal Hamilton所说,我们需要添加:true来添加严格的相等检查。

Adding :true won't work when the output of the md-select isn't a number so we can add a filter to parse the output to a number like:

添加:当md-select的输出不是数字时,true将不起作用,因此我们可以添加一个过滤器来将输出解析为如下数字:

.filter('parseInt', function() {
    return function(number) {
        if(!number) {
            return false;
        }
        return parseInt(number , 10);
    };
})

We can add this filter to the ng-repeats' filter like:

我们可以将此过滤器添加到ng-repeats的过滤器中,如:

ng-repeat="activity in guild.history_updates | filter : {
    action_type: (filters.action_type | parseInt ),
    user_id: filters.user,
} : true"

Edit: When you don't want to strict check every value in the filters you can use multiple filters like:

编辑:当您不想严格检查过滤器中的每个值时,您可以使用多个过滤器,如:

ng-repeat="activity in guild.history_updates
| filter : {
    action_type: (filters.action_type | parseInt ),

} : true
| filter: {
    user_id: filters.user
}"