How do I create a custom format in a string with Angularjs?

Question

Well I have a date 19102015, if I do so

{{step.data | date:'dd/MM/yyyy'}} 

i can format the date and get 19/10/2015.

But in my case, I need something customized. I have a cnpj that comes like this: 00000000000000 and I need to format it like this

00.000.000/0000-00

Can anyone tell me how I create specific formations with Angularjs ?

Thank you

Answer 1

What you’re looking for in Angularjs is called filter.

A filter takes an input value and optional configuration parameters, and returns a value that will be effectively displayed in the interface.

A filter is established as follows:

angular.module('MeuModulo', []).filter('nomeDoFiltro', function() {
    return function(input, arg1, arg2) {
        var out;
        // manipula input e seus argumentos...
        return out;
    };
});

For example, a filter that transforms a string into uppercase when parameter is true, and in lowercase when the parameter is false:

angular.module('MeuModulo', []).filter('case', function() {
    return function(input, uppercase) {
        var out = "";
        if ( uppercase ) {
            out = input.toUpperCase();
        } else {
            out = input.toLowerCase();
        }
        return out;
    };
});

This filter can then be used in your HTML:

<p>{{ 'minha string' | case:true }}</p>

Echoing after processed by Angularjs:

<p>MINHA STRING</p>

See more about creating filters in the Angularjs documentation:

Developer Guide: Filters

Creating the filter for the CNPJ is a workout!