pipe angular typescript use pipe in ts file angulr

The solution for “pipe angular typescript use pipe in ts file angulr” can be found here. The following code will assist you in solving the problem.

import { YourPipeComponentName } from ‘your_component_path’;

class YourService {

constructor(private pipe: YourPipeComponentName) {}

YourFunction(value) {
this.pipe.transform(value, ‘pipeFilter’);
}
}
// pipe.ts
@Pipe({ name: ‘filter’, pure: true })
export class FilterPipe{
transform(items: any[], args: any): any {
let filter = args.toString();
if(filter !== undefined && filter.length !== null){
if(filter.length === 0 || items.length ===0){
return items;
}else{
return filter ? items.filter(item=> item.title.toLocaleLowerCase().indexOf(filter) != -1) : items;
}
}
}
}
// component.ts (Use in your typescript code)
const filterPipe = new FilterPipe();
const fiteredArr = filterPipe.transform(chkArray,txtSearch);
//

First import your pipe in component. And then use your pipe in your component. Like this..

pipe.ts

/**
* filter checkbox list
*/
@Pipe({ name: ‘filter’, pure: true })
export class FilterPipe{
transform(items: any[], args: any): any {
let filter = args.toString();
if(filter !== undefined && filter.length !== null){
if(filter.length === 0 || items.length ===0){
return items;
}else{
return filter ? items.filter(item=> item.title.toLocaleLowerCase().indexOf(filter) != -1) : items;
}
}
}
}

component.ts (Use in your typescript code)

const filterPipe = new FilterPipe();
const fiteredArr = filterPipe.transform(chkArray,txtSearch);

// xyz.html (Use in your html file)

  • {{todo.name}}

Thank you for using DeclareCode; We hope you were able to resolve the issue.

More questions on [categories-list]

0
inline scripts encapsulated in