zoukankan      html  css  js  c++  java
  • How to Create Custom Filters in AngularJs

    http://www.codeproject.com/Tips/829025/How-to-Create-Custom-Filters-in-AngularJs

    Introduction

    Filter in Angular JS is a way that will help you to represent your data in View in a certain format. There are many inbuilt filters provided by Angular js that give us the way to format our data in View. With these inbuilt filters, we can format & show our data in various ways. Text can be shown in uppercase, lowercase. Date can be also represented in various formats. All we need to do it is add a "|" (pipe) after the data.

    Example: {{ 'Hello World' | uppercase }}

    We can also create custom filter to display our data in a particular way that we want.
    Let's see how we can create a custom filter. I am going to implement a custom filter, which reverses the input entered in a text box.

    How to Create Custom Filters

    //Initialize your ng-app
    var myapp = angular.module('MyApp', []);
    
    //Create a Filter
    myapp.filter("reversetext", function() {
    
            //Defining the filter function
             return function(input) {
     
                     var result = "";
                     input = input || "";
    
                    for (var i=0; i<input.length; i++) {
                           result = input.charAt(i) + result;
                     }
        
                    return result;
             };
    });

    Now Use the Filter in your View with HTML

    <body ng-app="MyApp">
           <input type="text" ng-model="text" placeholder="Enter text"/>
            <p>Filtered Reverse Input: {{ text | reversetext }}</p>
    </body>
  • 相关阅读:
    lms框架服务注册中心
    lms框架应用服务接口和服务条目详解
    lms框架模块详解
    lms微服务框架主机介绍
    lms框架分布式事务使用简介
    MySQL锁总结
    VSCode 输出 java SSL 请求过程
    PowerShell自动化发布SpringBoot项目到Tomcat
    AWS EC2 使用---安装Docker和Nginx
    使用PowerShell连接到Linux
  • 原文地址:https://www.cnblogs.com/facial/p/5474407.html
Copyright © 2011-2022 走看看