Angular: o tubo limitTo não está funcionando
Estou tentando correrlimitTo
pipe no Angular2 em uma string:
{{ item.description | limitTo : 20 }}
E eu recebo o seguinte erro:
The pipe 'limitTo' could not be found
É possível que este tubo tenha sido removido no Angular2?Este é meuapp.module
import {TruncatePipe} de './limit-to.pipe';
@NgModule({
imports: [
BrowserModule,
FormsModule,
HttpModule,
InMemoryWebApiModule.forRoot(InMemoryDataService),
RouterModule.forRoot([
{
path: '',
redirectTo: '/home',
pathMatch: 'full'
},
{
path: 'home',
component: GridComponent
},
])
],
declarations: [
AppComponent,
TopNavComponent,
GridComponent,
TruncatePipe
],
providers: [
PinService,
],
bootstrap: [ AppComponent ]
})
export class AppModule { }
Meu componente de grade que está usando o pipe:
import { Component,OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
moduleId : module.id,
selector: 'my-grid',
templateUrl : 'grid.component.html',
styleUrls: [ 'grid.component.css']
})
export class GridComponent implements OnInit{
constructor(
private router: Router,
private gridService: GridService) {
}
ngOnInit(): void {
}
}
Definição de My Pipe:
import { PipeTransform, Pipe } from '@angular/core';
@Pipe({
name: 'limitToPipe'
})
export class TruncatePipe implements PipeTransform {
transform(value: string, limit: number) : string {
let trail = '...';
return value.length > limit ? value.substring(0, limit) + trail : value;
}
}
E finalmente meu modelo:
<div *ngFor="let item of items" class="grid-item">
<p class="simple-item-description">
{{ item.description | limitToPipe : 20 }}
</p>
</div>