Question

我对Typescript很新，并尝试创建我的第一个Pipe。我有它在多个字段上工作，但我有一个问题 - 有一个字段可能包含空值，我不知道使用什么语法来进行此检查。这是我的代码：

    import { PipeTransform, Pipe } from '@angular/core';
import { IFixture } from '../shared/entities/fixture';

@Pipe({
    name: 'fixtureFilter'
})

export class FixtureFilterPipe implements PipeTransform {

    transform(value: IFixture[], filterBy: string): IFixture[] {
        /** check filter string is passed in and if so convert to lower case */
        filterBy = filterBy ? filterBy.toLocaleLowerCase() : null;

        /** indexOf checks if string is found, else do not filter  */
        return filterBy ? value.filter((fixture: IFixture) =>

            (fixture.homeTeam.teamName.toLocaleLowerCase().indexOf(filterBy) !== -1) ||
            (fixture.awayTeam.teamName.toLocaleLowerCase().indexOf(filterBy) !== -1) ||
            (fixture.week.weekNumber.toLocaleLowerCase().indexOf(filterBy) !== -1) ||
            (fixture.homeTeamScore.toString().toLocaleLowerCase().indexOf(filterBy) !== -1) ||
            (fixture.awayTeamScore.toString().toLocaleLowerCase().indexOf(filterBy) !== -1) ||
            (fixture.tournament.tournamentName.substr(fixture.tournament.tournamentName.length - 4).indexOf(filterBy) !== -1))
            : value;
    }
}

homeTeamScore和awayTeamScore上面是可以为null的数字类型，我必须将它们转换为字符串才能在过滤器中使用它们。如果它们不为null，那么用于仅转换为字符串的正确语法是什么？

我得到的错误是“无法读取属性＆＃39; toString＆＃39; of null＆＃39;在这一行：

(fixture.homeTeamScore.toString().toLocaleLowerCase().indexOf(filterBy) !== -1)

以下是一些请求的示例JSON数据：

[{"fixtureId":8,"tournamentId":2,"tournament":{"tournamentId":2,"tournamentName":"League 2023","seasonId":18,"season":{"seasonId":18,"seasonName":"2023"}},"weekId":11,"week":{"weekId":11,"weekNumber":"11"},"awayTeamId":43,"awayTeam":{"teamId":43,"teamName":"New York Jets","logoImage":"http://url/app/assets/images/logos/nyjets.png","headerImage":"http://url/app/assets/images/headers/nyjets.png","coachImage":"http://url/app/assets/images/coaches/nyjets.png","cheerleaderImage":"http://url/app/assets/images/cheerleaders/nyjets.png","divisionId":7,"division":null,"coachId":81,"coach":null},"homeTeamId":32,"homeTeam":{"teamId":32,"teamName":"Houston Texans","logoImage":"http://url/app/assets/images/logos/houston.png","headerImage":"http://url/app/assets/images/headers/houston.png","coachImage":"http://url/app/assets/images/coaches/houston.png","cheerleaderImage":"http://url/app/assets/images/cheerleaders/houston.png","divisionId":6,"division":null,"coachId":87,"coach":null},"awayTeamScore":31,"homeTeamScore":16,"isOvertime":false},{"fixtureId":21,"tournamentId":2,"tournament":{"tournamentId":2,"tournamentName":"League 2023","seasonId":18,"season":{"seasonId":18,"seasonName":"2023"}},"weekId":2,"week":{"weekId":2,"weekNumber":"2"},"awayTeamId":38,"awayTeam":{"teamId":38,"teamName":"Miami Dolphins","logoImage":"http://url/app/assets/images/logos/miami.png","headerImage":"http://url/app/assets/images/headers/miami.png","coachImage":"http://url/app/assets/images/coaches/miami.png","cheerleaderImage":"http://url/app/assets/images/cheerleaders/miami.png","divisionId":7,"division":null,"coachId":82,"coach":null},"homeTeamId":43,"homeTeam":{"teamId":43,"teamName":"New York Jets","logoImage":"http://url/app/assets/images/logos/nyjets.png","headerImage":"http://url/app/assets/images/headers/nyjets.png","coachImage":"http://url/app/assets/images/coaches/nyjets.png","cheerleaderImage":"http://url/app/assets/images/cheerleaders/nyjets.png","divisionId":7,"division":null,"coachId":81,"coach":null},"awayTeamScore":21,"homeTeamScore":55,"isOvertime":false}]

编辑：已修复，原来是一个简单的解决方案：

transform(value: IFixture[], filterBy: string): IFixture[] {
    /** check filter string is passed in and if so convert to lower case */
    filterBy = filterBy ? filterBy.toLocaleLowerCase() : null;

    /** indexOf checks if string is found, else do not filter  */
    return filterBy ? value.filter((fixture: IFixture) =>

        (fixture.homeTeam.teamName.toLocaleLowerCase().indexOf(filterBy) !== -1) ||
        (fixture.awayTeam.teamName.toLocaleLowerCase().indexOf(filterBy) !== -1) ||
        (fixture.week.weekNumber.toLocaleLowerCase().indexOf(filterBy) !== -1) ||
        (fixture.homeTeamScore !== null ? fixture.homeTeamScore.toString().toLocaleLowerCase().indexOf(filterBy) !== -1 : false) ||
        (fixture.awayTeamScore !== null ? fixture.awayTeamScore.toString().toLocaleLowerCase().indexOf(filterBy) !== -1 : false) ||
        (fixture.tournament.tournamentName.substr(fixture.tournament.tournamentName.length - 4).indexOf(filterBy) !== -1))
        : value;
}

Answer 1

首先，看看下面的一行

transform(value: IFixture[], filterBy: string): IFixture[] {

管道的输入和输出通常不是数组对象。因此，首先将其修复到

下面

transform(value: IFixture, filterBy: string): IFixture {

如果您可以使用json数据更新帖子。我可以帮你。还要看一下这个类似的answer。

在转换为字符串

1 个答案: