例如:

*ngIf="step?.salaryChangedBy?.updated | issalaryUpdated : lastViewedByUser : step?.salaryChangedBy?.userId : userId"

或者格式化后的文件更具可读性:

*ngIf="
    step?.salaryChangedBy?.updated
        | issalaryUpdated
        : lastViewedByUser
        : step?.salaryChangedBy?.userId
        : userId
"

对我来说,语法非常奇怪.谁能告诉我这些连续的冒号在这里是干什么的?顺便说一句,issalaryUpdated是一根管子.

我试着在互联网上搜索这些棱角分明的文档和帖子,但没有找到有用的信息.有谁能给我点线索吗?谢谢!

推荐答案

在您的代码示例中,issalaryUpdated是一个接受四个参数并返回布尔值(将以*ngIf计算)的管道

IssalaryUpated管道应该如下所示

@Pipe({ name: 'issalaryUpdated' })
export class IsSalaryUpdatedPipe implements PipeTransform {
  transform(
    updated: any,
    lastViewedByUser: any,
    salaryChangedByUserId: string,
    currentUserId: string
  ): boolean {
    // return a boolean here based on logic involving updated, lastViewByUser, salaryChangedByUserId and currentId
  }
}

语法|表示您正在使用管道

:分隔的值是管道的参数

有关带有多个参数的管道如何工作的更多信息,请查看to this answer

Angular相关问答推荐

文件阅读器未正确给出某些CSV文件的结果

如何在Angular 17中使用Angular—calendum?

在Angular 多选下拉菜单中实现CDK拖放排序的问题

我应该对我想要在我的Angular 17+组件中显示的任何变量使用信号吗?

无法在Mat-SideNav中绑定模式

用于 React 的 ngx-extended-pdf-viewer

在 kubernetes 上创建 Ingress 服务以将 springboot [后端] 连接到前端 [angular]

个人修改 Angular CLI - 创建新应用

在Angular 4中有条件地应用点击事件

缺少 .angular-cli.json 文件:Angular

Angular 5 国际化

如何在Angular2中基于特定的构建环境注入不同的服务?

请添加@Pipe/@Directive/@Component 注解

如何在 bootstrap Angular 2 应用程序时调用休息 api

ERROR 错误:StaticInjectorError(AppModule)[UserformService -> HttpClient]:

实现自定义 NgbDateParserFormatter 来更改 NgbInputDatepicker 上输入值的格式是否正确?

Angular 4 设置下拉菜单中的选定选项

Angular Material2 主题 - 如何设置应用程序背景?

BrowserAnimationsModule 和 NoopAnimationsModule 有什么区别?

Angular 9 引入了需要加载的全局$localize()函数