用子数组过滤数组

Question

我在创建搜索过滤器时遇到问题，我在模块中使用 * ngFor，名称通常如下所示：

(game.name.toLowerCase().includes(typed))

但是数组中的平台只有在我放置索引时才有效：

(game.platform[i].toLowerCase().includes(typed))

但是这个平台是动态的，我不能在过滤器中使用 for 或类似的东西

Json

[
    {
        "name":"GTA",
        "platform":[
            "xbox",
            "playstation"
        ]
    }
]

组件

<tr *ngFor="let game of (games | searchGame:SearchedText.value)">
    <td>{{game.name}}</td>
    <td>{{game.category}}</td>
    <td>{{game.platform | separator}}</td> 
    // "platform":["Playstation 4","Xbox One"]
    <td>{{game.price | currency}}</td>
    <td>{{game.quantity}}</td>
    <td>{{game.production ? 'Sim' : 'Não'}}</td>
    <td>{{game.description}}</td>
    <td><i class="fa fa-pencil icon" aria-hidden="true" (click)="staticModal.show()"></i></td>
    <td><i class="fa fa-times icon" aria-hidden="true" (click)="staticModal.show()"></i></td>
</tr>

管道

transform(game, typed){

    typed = typed.toLowerCase();

    return game.filter( game =>

        (game.name.toLowerCase().includes(typed)) ||

        (game.category.toLowerCase().includes(typed)) ||

        (game.platform.toLowerCase().includes(typed)) || // Error in this line

        (game.price.toLowerCase().includes(typed)) ||

        (game.quantity.toLowerCase().includes(typed)) ||

        (game.production.toLowerCase().includes(typed)) ||

        (game.description.toLowerCase().includes(typed))

    );


}

Answer 1

如果我对你的问题的理解正确，那么你的过滤器没有达到你的要求。

第一个管道参数应该是一个数组。我认为 'any' 有效，但 'any[]' 更干净:-)

您正在做：

tranform(game: any,...)

试试这个：

transform(game: any[], typed: string){

....

return game.filter(game => game.name.toLowerCase().indexOf(typed) > -1 ||
....

此外，在开始时，您的搜索标记（键入的）可能为 null 或为空。为此，您应该将以下内容添加到 return 未过滤的数组。否则你将不会在你的 *ngFor 中看到任何东西。

if (typed == null || typed == "")
    return game;

希望对您有所帮助。

编辑：将错误行替换为

game.filter(game => game.platforms.some(el => el.toLocaleLowerCase().includes(typed)))

用子数组过滤数组

Filter array with subarray

arrays

filter

ngfor

angular2-pipe

angular