Angular 过滤器filter

最新推荐文章于 2024-08-13 10:47:34 发布

boonyaxnn

最新推荐文章于 2024-08-13 10:47:34 发布

阅读量845

点赞数

分类专栏： angular 过滤器

本文链接：https://blog.csdn.net/boonyaxnn/article/details/90481689

版权

本文介绍了Angular中的过滤器(filter)功能，包括基本用法、自定义过滤器创建以及多级过滤器的应用。过滤器用于数据筛选和处理，通过管道符( | )在表达式和指令中使用。同时，文章提到了日期格式化，展示了多种日期格式的参数选项。

摘要由CSDN通过智能技术生成

1、过滤器是对数据进行筛选/处理，在数据展示时使用；过滤器可以使用一个管道字符（|）添加到表达式和指令中。
语法： { { data | filter名称:参数 }}
{ {expression | filter1 |filter2 |…}}

    <!--货币过滤器
        currency  currency:"¥"格式化数字为货币格式。
    -->
    <h2>{
  {money | currency:'￥' }}</h2>
    <h2>{
  {money | currency:'$' }}</h2>

    <!-- 日期过滤器
        date:'yyyy/MM/dd hh:mm:sss'
    -->
    <h3>{
  {time | date:'yyyy/MM/dd hh:mm:ss' }}</h3>
    <h3>{
  {time | date:'yyyy-MM-dd HH:mm:ss' }}</h3>
    <h3>{
  {time | date:'yyyy-MM-dd a HH:mm:ss' }}</h3>

    <!-- 
        大小写转换
            lowercase
            uppercase

     -->
     <p> {
  {'Hello' | lowercase}}</p>
     <p> {
  {'hello' | uppercase}}</p