angular自定义pipe最佳实践

1. 前言

首先这边文章并不是告诉你如何创建复杂的pipe,而是就如何创建自定义pipe以及如何做到重用的一些实践。

2. angular内置pipe

angular框架为我们内置了许多pipe,常用的date、async ...,当然还有很多内置的pipe,这里就不一一例举了,因为不是本篇文章的重点,想了解更多内置pipe的请访问这里内置pipie官方链接

3. 自定义pipe

这里举一个例子Capitalize,目的是实现首字母大写。代码如下:

import { Pipe, PipeTransform } from '@angular/ore';

@Pipe({ name: 'capitalize' })
export class CapitalizePipe implements PipeTransform {
    transform(value: any) {
        if (value) {
            return value.chartAt(0).toUpperCase() + value.slice(1);
        }
        return value;
    }
}

你可能感兴趣的:(angular自定义pipe最佳实践)