Angularテンプレートで関数が呼ぶのはあまり良くない
にも書いたが、テンプレート内で関数を呼び出すことはあまり良い方法ではないということだが、そこで、AngularのPipe機能を使うという手もあるなと思いました。
AngularのPipeとは
テンプレート上に埋め込まれたデータを加工・整形するための仕組み。
Angularには標準的なパイプ(dateパイプやjson,asyncパイプのなど)があるがそれを自作することができる。
俗に言うCustom Pipeがある。
与えれた要素の加工・整形だけではなく、DatePipeのように、パラメーターも定義することができる
ただし、PupePipeを使おう
AngularのPureパイプは処理を高速化するために、純粋な変更が検出した場合にパイプを実行します。
純粋な変更が検知されたタイミングとは具体的には、
1.プリミティブ型(String,number,Boolean,Symbol)の値が変更された時
2.オブジェクト型(Date,Array,Function,Objectなど)の参照が変更された時
が当てはまります。
逆に言えば、impureなパイプを使用するとページ内で発生したすべてのイベント(変更)をもとに無制限に再評価されることになります。
他に良い手があれば
もしかしたら他に良い手があればコメントやDMで教えて頂けると助かります。