0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

テンプレートで関数が呼び出せないならPipeを使えばいいじゃん!

Posted at

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で教えて頂けると助かります。

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?