Truncamento de String via Pipe em Angular

Vamos aprender a usar o pipe SlicePipe. Este pipe permite truncar uma string. Ele aceita parâmetros que definem os índices inicial e final do recorte. Para passar um parâmetro, após o nome do pipe, usa-se dois pontos e lista-se os parâmetros.

Vamos ver um exemplo. Na classe do componente, vamos definir uma propriedade name:

app/app.component.tsexport class AppComponent {
  name: string = 'john';
}

Agora, usando o pipe SlicePipe, vamos truncar a string, especificando os índices inicial e final para ela:

app/app.component.html<div>
  {{ name | slice:0:2 }}
</div>

Como resultado, obteremos o seguinte:

app/app.component.html<div>
  jo
</div>