Question

50

How to use pipe in ts not HTML

rated 0 times [ 52] [ 2] / answers: 1 / hits: 58826 / 8 Years ago, fri, september 23, 2016, 12:00:00

I adding text into html element from ts

like this

this.legend.append('text')

  .attr('x', legendRectSize + legendSpacing)

  .attr('y', legendRectSize - legendSpacing)

  .text(function(d) { return d; });

this will create html like

<text>Data will come here</text>

I want to use pipe to convert this data into some form
how can I do that from ts code ?

and as I am creating this HTML dynamically I cannot use pipe like this

<text>{{Data will come here | pipename}} </text>

I am looking for somethig like

this.legend.append('text')

  .attr('x', legendRectSize + legendSpacing)

  .attr('y', legendRectSize - legendSpacing)

  .text(function(d) { return d; }).applypipe('pipename');

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

keana

Add To Favorites

Follow

Total Points: 452

Total Questions: 97

Total Answers: 81

Location: Barbados

Member since Sun, Nov 27, 2022

2 Years ago

answered 8 Years ago jackelyn · Accepted Answer

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)

<ul>

    <li *ngFor=todo for todos | filter:'txtsearch'> {{todo.name}} </li>

</ul>