メインコンテンツまでスキップ

REFERENCE

開発者リファレンス

認証、API、SDK、Flow Agent のプロセッサ、パラメータ解決のリファレンスです。

Handlebars 5 分入門

Handlebars は Asgard の Template モードで使うテンプレートエンジンです。簡潔な構文で動的なテキストを生成できます。

  1. 基本の考え方​

    Handlebars は波括弧で動的な内容を差し込みます。書き方は 2 つあります。

    二重波括弧と三重波括弧の違い​

    二重波括弧 {{}} — HTML エスケープあり

    Hello {{name}}！ご注文番号は {{orderNumber}} です

    三重波括弧 {{{}}} — エスケープなし

    Hello {{{name}}}！ご注文番号は {{{orderNumber}}} です
    構文用途HTML エスケープ例
    {{}}通常のテキスト出力✅ エスケープする{{content}} → <script>
    {{{}}}生の内容の出力❌ エスケープしない{{{content}}} → <script>

    Asgard での使い分け​

    **Asgard では、ほとんどの場合三重波括弧 {{{}}} を使ってください。**理由は次のとおりです。

    • 意図しない変換を避けられます: 特殊文字が壊れません（< が &lt; になるなど）
    • データがそのまま保たれます: 変数の内容が入力どおりに出力されます
    Hello {{{name}}}！ご注文番号は {{{orderNumber}}} です

    出力:

    Hello Alice！ご注文番号は ORD20240115001 です

    📖 構文をしっかり学ぶ
    Handlebars の構文全体は公式ドキュメントにあります

  2. 中心となる構文​

    変数の差し込み​

    {{{user.name}}} 様、こんにちは！会員ランクは {{{user.level}}} です

    条件分岐​

    {{#if hasNewOrders}}
      新しいご注文が
      {{{newOrderCount}}}
      件あります
    {{else}}
      現在、新しいご注文はありません
    {{/if}}

    繰り返し​

    • 商品一覧:
    {{#each products}}
      {{{@index}}}.
      {{{name}}}
      - NT$
      {{{price}}}
    {{/each}}

  3. Asgard の組み込みヘルパー​

    Asgard は 8 つのヘルパーを提供しています。

    {{{history 0 -1}}}
    <!-- 対話履歴 -->
     
    {{{historySize}}}
    <!-- 対話の件数 -->
     
    {{{toJson user}}}
    <!-- JSON への変換 -->
     
    {{{urlEncode searchKeyword}}}
    <!-- URL エンコード -->
     
    {{{xpathExtract xmlData '/root/item'}}}
    <!-- XML の検索 -->
     
    {{{vecToStr vector '[' ']' ','}}}
    <!-- ベクトルを文字列へ -->
     
    {{{isoNow 'Asia/Taipei'}}}
    <!-- 現在の時刻 -->
     
    {{{isoToday 'Asia/Taipei'}}}
    <!-- 今日の日付 -->

  4. 実用例​

    基本のメッセージテンプレート​

    {{{user.name}}}
    様、こんにちは！ 
    システムの状態: 
    • 対話の件数: {{{historySize}}} 件
    • 現在の時刻: {{{isoNow 'Asia/Taipei'}}}
     
    {{#if hasUpdates}}
      直近の対話:
      {{{history -3 -1}}}
    {{/if}}

    ボタンのテンプレート​

    {
      "type": "BUTTON",
      "title": "{{{user.name}}} 様の情報",
      "text": "会員情報:\n{{{toJson user}}}",
      "buttons": [
        {
          "label": "履歴を見る",
          "action": {
            "type": "MESSAGE",
            "text": "対話履歴を表示"
          }
        }
      ]
    }

    API 照会の例​

    • 検索: {{{urlEncode query}}}
    • 照会時刻: {{{isoNow 'Asia/Taipei'}}}
     
    {{#if xmlResponse}}
    • 結果:
      {{{xpathExtract xmlResponse '//item/title'}}}
    {{/if}}

  5. Template と Expression の選び方​

    場面使うもの理由
    テキストのテンプレートTemplate構文が簡潔
    複雑な計算ExpressionJavaScript の機能をすべて使える
    条件分岐Template組み込みで対応
    数値計算Expressionより柔軟

  6. 早見表​

    ✅ 変数の差し込み: {{{variable}}}
    ✅ 条件分岐: {{#if condition}}
    ✅ 繰り返し: {{#each array}}
    ✅ Asgard のヘルパー: 8 つ
    ✅ オブジェクトのプロパティ: {{{user.name}}} で入れ子にアクセス

  7. さらに学ぶ​

    標準の Handlebars 構文と Asgard のヘルパーを組み合わせれば、実用的な動的メッセージテンプレートを作れます。

始める準備はできましたか？

Asgard をチームでどう活用できるか、お気軽にご相談ください。

お問い合わせ