Skip to main content

blocs/blocs: 表示の装飾(data-prefix/postfix)と変換(data-convert)

blocs/blocs: 表示の装飾(data-prefix/postfix)と変換(data-convert)

文字列の装飾(prefix/postfix)と表示形式の変換(data-convert)について説明します。

表示する変数に文字列を追加する(data-prefix / data-postfix)

data-prefix は変数の先頭に、data-postfix は変数の末尾に文字列を追加します。値が存在する場合(0 も存在とみなす)のみ追加されます。タグ記法・コメント記法の両方で使用可能です。

data-prefix の使用例

変数の先頭に文字列を追加して表示:

<span data-val=$price data-prefix="¥"></span>

別の変数に代入する場合:

<!-- data-assign=$price data-val=$value data-prefix="¥" -->
<span><!-- $price --></span>

属性値として利用する場合:

<!-- :href=$url data-prefix="http://" -->
<a>Google</a>

data-postfix の使用例

<span data-val=$price data-postfix="円"></span>

data-assigndata-attribute と組み合わせることも可能です。

変数の表示形式を整形する(data-convert)

data-convert は表示形式を整形します。元の値そのものは変更されません(値を変更するのは data-filter)。タグ記法・コメント記法の両方で使用可能です。

サンプルコード

<!-- $user->created_at data-convert="date" -->

利用可能な変換形式一覧

data-convert を指定しなくても HTML エスケープと改行の <br /> 変換(nl2br)が行われます。data-convert="raw" でエスケープなしの生出力が可能ですが、セキュリティ脆弱性に注意してください。

data-convertの値 表示結果の例
number 30,000(カンマ区切り)
number:2 30,000.00(小数点以下2桁)
hidden *****(値を伏字表示)
date 2013/12/05(日付形式)
date:"Y/m/d H:i:s" 2013/12/05 23:03:04(日時形式)
date:"Y.m.d" 2013.12.05(ピリオド区切り)
jdate:"m/d(D)" 12/05(木)(日本語曜日付き)
uploadsize 5 KB(ファイルサイズ表示)
ellipsis:10 Lorem ipsu...(10文字で省略)
raw_download アップロードファイルへのリンク表示
raw_thumbnail アップロードファイルのサムネイル表示
raw_autolink URLを自動的にリンク化

上記に加え、PHP の組み込み関数(例: trim)やクラスの public static メソッドも指定できます。

独自の変換ロジックを追加する方法

1. 独自コンバート関数を定義

public static メソッドとして定義します。

public static function unit($str, $parameter1)
{
    return $str . $parameter1;
}

2. テンプレートから呼び出す

コロン : で区切って引数を渡せます。

<!-- $price data-convert="App\\Http\\Controllers\\Admin\\UserController::unit:'円'" -->