我们不应该在 HTML 中使用方法,除非它们与事件相关联:
这里存在被执行多次的问题。在示例中,正在映射一个数组,这将执行 16 次。同样,我们不应该直接使用 get 或 API 请求。
这可以使用管道和/或创建自定义管道来解决,该管道只会为每个用户执行一次。在此示例中,管道具有一个转换方法,该方法接收与之前使用的方法相同的参数:
解释:
方法的问题是因为它们不是 Angular 原生的,所以 Angular 不知道它们的值何时发生了变化。因此,它会在每次小更新后不断评估更改方法。
相比之下,管道是本机的、纯粹的,并且仅在其参数更改时才执行。此外,管道可以在应用程序的不同部分中重用(与方法不同,方法只能通过将其发送到服务来重用)。
如果管道不存在,我们可以通过指定其目标位置来创建管道:
ng g p Pipes/fullName(其中 Pipes/fullName 是位置)。
管道被创建为实现 PipeTransform 的类,该接口要求我们有一个转换方法。该方法在管道运行时执行,并且像普通方法一样工作。要使用创建的管道,我们必须将其导入应用程序组件(独立):
在 HTML 中使用它时,我们通过管道名称字段中指示的名称来调用它,使用“|”符号后跟管道名称。第一个参数传递到左侧,如果我们想传递其他参数,则将它们传递到右侧,在冒号“:”之后:
记住好的做法:如果有很多参数,最好使用对象。作为一个好的做法,尽量不要过度使用管道以避免混乱。分解代码,你就会成功。
为了创建管道的内容,我们在转换方法中指定要接收的参数和返回类型。然后我们写入内容并返回结果。可以通过在其前面加上“?”前缀来接收可选值,并且可以使用“=”来分配默认值。
— 基于 EfisioDev 的 Angular 课程的笔记 —
免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。
Copyright© 2022 湘ICP备2022001581号-3