Angularda Pipe ile String içerinde kısaltma ve ... ekleme
1) Custom pipe oluşturmak için terminal yardımıyada yapabiliriz ya da kendimiz de yazabiliriz.
terminal ile yapmak için
ng g pipe summary yazmamız yeterlidir burada kendisi otomatik olarak dosyaları oluşturucak ve app.module.ts içerisine bu oluşturmuş oldugu pipe ın bilgsisi declaretion kısmını ekliycektir.
aşağıdaki kodlarda summary isimnde pipe oluşturulmuştur. default olarak 50 karakterlik yazıdan sonra ... konulması şeklinde düzenlenmiştir.
import {Pipe,PipeTransform} from "@angular/core";
@Pipe({name:'summary'})
export class SummaryPipe implements PipeTransform{
transform(value:string,limit?:number){
if(!value){ return null;}
limit=limit? limit:50;
if(limit>value.length){
return value;
}
return value.substring(0,limit)+'...';
}
}
peki html tarafında bunu yazmalıyız
{{item.description | summary:30}} dediğimizde 30 karakterden sonra üç nokta ekleyerk göstericektir.
Angularda Pipe ile String içerinde kısaltma ve ... ekleme
