Angular Comma Pipe return comma seprated

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

@Pipe({

name: 'comma'

})

export class CommaPipe implements PipeTransform {

transform(value: any, args?: any): any {

if (value) {

return (', ').concat(value)

} else {

return value;

}

}

}

Angular count car pipe apply in string.

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

@Pipe({

name: 'countChar',

pure: false

})

export class CountCarPipe implements PipeTransform {

transform(text: string, args: number) {

let maxLength = args || 140

let length = text.length;

return (maxLength - length);

}

}

Angular order pipe apply on object

/*

* Example use

*      Basic Array of single type: *ngFor="#todo of todoService.todos | orderBy : '-'"

*      Multidimensional Array Sort on single column: *ngFor="#todo of todoService.todos | orderBy : ['-status']"

*      Multidimensional Array Sort on multiple columns: *ngFor="#todo of todoService.todos | orderBy : ['status', '-title']"

*/

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

@Pipe({ name: 'orderByPipe', pure: false })

export class OrderBy implements PipeTransform {

static _orderByComparator(a: any, b: any): number {

if ((isNaN(parseFloat(a)) || !isFinite(a)) || (isNaN(parseFloat(b)) || !isFinite(b))) {

// Isn't a number so lowercase the string to properly compare

if (a.toLowerCase() < b.toLowerCase()) {

return -1;

}

if (a.toLowerCase() > b.toLowerCase()) {

return 1;

}

} else {

// Parse strings as numbers to compare properly

if (parseFloat(a) < parseFloat(b)) {

return -1;

}

if (parseFloat(a) > parseFloat(b)) {

return 1;

}

}

return 0; // equal each other

}

transform(input: any, [config = '+']): any {

if (!Array.isArray(input)) {

return input;

}

if (!Array.isArray(config) || (Array.isArray(config) && config.length === 1)) {

var propertyToCheck: string = !Array.isArray(config) ? config : config[0];

var desc = propertyToCheck.substr(0, 1) === '-';

// Basic array

if (!propertyToCheck || propertyToCheck === '-' || propertyToCheck === '+') {

return !desc ? input.sort() : input.sort().reverse();

} else {

var property: string = propertyToCheck.substr(0, 1) === '+' || propertyToCheck.substr(0, 1) === '-'

? propertyToCheck.substr(1)

: propertyToCheck;

return input.sort(function (a: any, b: any) {

return !desc

? OrderBy._orderByComparator(a[property], b[property])

: -OrderBy._orderByComparator(a[property], b[property]);

});

}

} else {

// Loop over property of the array in order and sort

return input.sort(function (a: any, b: any) {

for (var i: number = 0; i < config.length; i++) {

var desc = config[i].substr(0, 1) == '-';

var property = config[i].substr(0, 1) == '+' || config[i].substr(0, 1) == '-'

? config[i].substr(1)

: config[i];

var comparison = !desc

? OrderBy._orderByComparator(a[property], b[property])

: -OrderBy._orderByComparator(a[property], b[property]);

// Don't return 0 yet in case of needing to sort by next property

if (comparison !== 0) {

return comparison;

}

}

return 0; // equal each other

});

}

}

}

Use of this pipe.

Data = new OrderBy().transform(Data, ['columnName']);

Angular unique pipe apply any object

import { element } from 'protractor';

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

@Pipe({

name: "unique",

pure: false

})

export class UniquePipe implements PipeTransform {

transform(value: any, level0?: any, level1?: any, level2?: any): any {

let f = [];

if (!Array.isArray(value)) return;

f = value.filter((n: any) => {

if (!n[level0]) return;

if (level1 == null && level2 == null) {

if (n[level0] === 0 || n[level0]) {

return f.indexOf(n[level0]) === -1 && f.push(n[level0]);

}

} else if (level2 == null) {

if (n[level0][level1] === 0 || n[level0][level1]) {

return (

f.indexOf(n[level0][level1]) === -1 && f.push(n[level0][level1])

);

}

} else {

if (n[level0][level1][level2] === 0 || n[level0][level1][level2]) {

return (

f.indexOf(n[level0][level1][level2]) === -1 &&

f.push(n[level0][level1][level2])

);

}

}

});

return f;

}

}

Angular filter Pipe to Dynamically Filter results

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

@Pipe({

name: 'filter',

pure: false

})

export class FilterPipe implements PipeTransform {

transform(value: any, property: any, propertyValue: any): any {

let f = [];

if (!Array.isArray(value)) return value;

if (propertyValue == 'All') return value;

f = value.filter((n: any) => {

if (!n[property]) return ;

if (n[property] === propertyValue) {

return f.push(n[property])

}

})

return f;

}

}

Angular File Icon Pipe/Filter. Show file icon on behalf of file extention

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

@Pipe({

name: 'fileicon'

})

export class FileiconPipe implements PipeTransform {

transform(fileMeta: any, fixedIcon: any): any {

if (this.isImage(fileMeta)) {

return 'mdi mdi-camera';

} else if (fixedIcon) {

return 'fa fa-download';

} else {

return this.getFileIcon(fileMeta.name);

}

}

/**

* return true if file is of image type

*/

isImage(file: File): boolean {

return /^image\//.test(file.type);

}

/**

* return file icon based on file name

*/

getFileIcon(filename): string {

let icon = 'mdi mdi-file'; // default Icon;

const ext = /^.+\.([^.]+)$/.exec(filename);

const fileExt = ext == null ? ' ' : ext[1];

if (fileExt === 'pdf') {

icon = 'mdi mdi-file-pdf';

} else if (fileExt === 'xlsx' || fileExt === 'xls' || fileExt === 'csv') {

icon = 'mdi mdi-file-excel';

} else if (fileExt === 'sql' || fileExt === 'txt' || fileExt === 'doc' || fileExt === 'docx' || fileExt === 'text') {

icon = 'mdi mdi-file-document';

} else if (fileExt === 'download') {

icon = 'mdi mdi-download ';

}

return icon;

}

}

Angular File size Pipe/Filter. Convert bytes into largest possible unit. e.g. 1024 => 1 KB

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

@Pipe({

name: 'filesize'

})

export class FilesizePipe implements PipeTransform {

private units = [

'bytes',

'KB',

'MB',

'GB',

'TB',

'PB'

];

transform(bytes: number = 0, precision: number = 2 ): string {

if ( isNaN( parseFloat( String(bytes) )) || ! isFinite( bytes ) ) {

return '?';

}

let unit = 0;

while ( bytes >= 1024 ) {

bytes /= 1024;

unit ++;

}

return bytes.toFixed( + precision ) + ' ' + this.units[ unit ];

}

}