メインコンテンツへスキップ

テンプレート

始める前に​

テンプレートを呼び出すサービスを作成する前に、REST Webサービスを作成する方法を理解していることを確認してください。まだ理解していない場合は、次のリンクを参照してください:

また、このチュートリアルを始める前に、_JavaScript_の基本を理解していることを確認することをお勧めします。

サービスでのテンプレートの使用​

このチュートリアルでは、テンプレートの作成と、サービスからテンプレートを呼び出すために必要な操作について説明します。

Netunoでサービスを作成するときは、自分で作成したテンプレートにアクセスするオプションがあります。つまり、結果に応じてサービスをデータ付きのHTMLテンプレートにリダイレクトできます。

この例では、基本的なHTMLテンプレートを用意し、サービスから同じテンプレートにデータを渡します。

テンプレートの作成​

テンプレート1

上記のディレクトリに移動したら、.htmlファイルを作成します。この例では、テンプレート.htmlという名前にします。

以下がこのページの内容です:

<!-- Netunoのヘッダーの呼び出し -->
_{include=_|includes/head}

<!-- スタイルの定義 -->

<style>
body, html {
margin: 10px;
}

h1, b {
color: #8182E6;
}
</style>

<!-- HTMLのbodyの開始 -->
<h1>テンプレートのタイトル</h1>

<!-- サービスからテンプレートにデータを渡す必要がある場合は _{&変数} を使用します -->
<p>こんにちは、私は<b>_{&data=名前}</b>で、サービスから<b>_{&data=データ}</b>を受け取っています!</p>

<!-- HTMLのbodyの終了 -->

<!-- Netunoのフッターの呼び出し -->
_{include=_|includes/foot}

最後に、次の関数でテンプレートを呼び出すサービスを作成します:

_template.output('テンプレート名', 変数(オプション));

以下はサービス「service.js」の例です:

// データを受け取れるようにオブジェクト 'データ' を初期化する
var データ = _val.init()

// オブジェクト 'データ' に値を設定する
.set("名前", "テンプレート")
.set("データ", "データ")

// この関数でテンプレートの呼び出しを行う
_template.output("テンプレート", データ);

テンプレートがサブディレクトリにある場合は、関数で次のように指定します:_template.output('ディレクトリ/テンプレート名')

最後に、ブラウザでサービスを呼び出すと、次のような画面が表示されます:

テンプレート2

使用しているブラウザによって、上記の表示結果が異なる場合があることに注意してください。

ご不明な点がありましたら、ページ末尾に記載されている方法でお気軽にお問い合わせください。

良い開発を!