Angularでのパイプを用いた文字列の切り取り

パイプ SlicePipe の使い方を学びましょう。このパイプは文字列を切り取ることができます。切り取りの開始インデックスと終了インデックスを指定するパラメータを受け取ります。パラメータを渡すには、パイプ名の後にコロンを置き、パラメータを列挙します。

例を見てみましょう。コンポーネントクラスにプロパティ name を設定します:

export class AppComponent {
	name: string = 'john';
}

次に、パイプ SlicePipe を使って文字列を切り取り、開始インデックスと終了インデックスを指定します:

<div>
	{{ name | slice:0:2 }}
</div>

結果は以下のようになります:

<div>
	jo
</div>

11 文字を含む文字列を作成してください。画面に、2 番目から 4 番目のインデックスまでの部分を表示してください。