dedicated pipe for truncating
This commit is contained in:
parent
66216075e7
commit
f977ffd65d
@ -11,6 +11,7 @@ import { GenderPipe } from './gender.pipe';
|
||||
import { ListPaginateComponent } from './list-paginate/list-paginate.component';
|
||||
import { ListService } from './list.service';
|
||||
import { ListComponent } from './list/list.component';
|
||||
import { TruncatePipe } from './truncate.pipe';
|
||||
|
||||
@NgModule({
|
||||
bootstrap: [AppComponent],
|
||||
@ -21,6 +22,7 @@ import { ListComponent } from './list/list.component';
|
||||
ListPaginateComponent,
|
||||
GenderPipe,
|
||||
CustomSortPipe,
|
||||
TruncatePipe,
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
@ -69,7 +69,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail">
|
||||
<p>{{ getPersonDetail(person) }}</p>
|
||||
<p>{{ person.intro | truncate:300:true }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
@ -67,16 +67,6 @@ export class ListComponent implements OnInit {
|
||||
}
|
||||
}
|
||||
|
||||
public getPersonDetail(person: IPerson): string {
|
||||
const str = person.intro.replace(/<.*?>/g, '');
|
||||
let words = str.split(' ');
|
||||
if (words.length >= 38) {
|
||||
words = words.slice(0, 37);
|
||||
words[words.length - 1] += '...';
|
||||
}
|
||||
return words.join(' ');
|
||||
}
|
||||
|
||||
private getList(): void {
|
||||
this.listService.getList().subscribe(
|
||||
(data) => {
|
||||
|
8
src/app/truncate.pipe.spec.ts
Normal file
8
src/app/truncate.pipe.spec.ts
Normal file
@ -0,0 +1,8 @@
|
||||
import { TruncatePipe } from './truncate.pipe';
|
||||
|
||||
describe('TruncatePipe', () => {
|
||||
it('create an instance', () => {
|
||||
const pipe = new TruncatePipe();
|
||||
expect(pipe).toBeTruthy();
|
||||
});
|
||||
});
|
14
src/app/truncate.pipe.ts
Normal file
14
src/app/truncate.pipe.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { Pipe, PipeTransform } from '@angular/core';
|
||||
|
||||
@Pipe({
|
||||
name: 'truncate',
|
||||
})
|
||||
export class TruncatePipe implements PipeTransform {
|
||||
public transform(value: string, limit = 10, words = false, ellipsis = '...'): string {
|
||||
value = value.replace(/<.*?>/g, '');
|
||||
if (words) {
|
||||
limit = value.substr(0, limit).lastIndexOf(' ');
|
||||
}
|
||||
return value.length > limit ? value.substr(0, limit) + ellipsis : value;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user