テンプレートを使用してスマートビュープロセスを作成する - 7.1

Talend Data Fabric Studio ユーザーガイド

author
Talend Documentation Team
EnrichVersion
7.1
EnrichProdName
Talend Data Fabric
task
ジョブデザインと開発
EnrichPlatform
Talend Studio

このタスクについて

スマートビューは、XSLTステップを使用して入力XMLレコードからのHTML表記をレンダリングします。最も簡単な方法は、Talend Studioの外でハードコードされた値を使用してHTMLテンプレートを作成することです。

<tr>
<td>Product Name</td><td>PROD NAME</td>
<!-- etc -->
</tr>

次に、このテンプレートをプロセスエディターでXSLTスタイルシートのBodyにコピー/貼り付けして、ハードコードされた値を<xsl:value-of>ステートメントで置換します。

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">  
    <xsl:output method="html" indent="yes"/>  
    <xsl:template match="/" priority="1"> 
        <html> 
            <head> 
                <title>Product</title> 
            </head>  
            <body> 
<tr>
<td>Product Name</td><td><xsl:value-of select="Product/Name"/></td>
<!-- etc -->
</tr>
            </body> 
        </html> 
   </xsl:template> 
</xsl:stylesheet>

たとえばhttp://www.phpform.org/を使用して、 フォームのWebテンプレートを作成します。Webテンプレートは、リソースのほかに1つまたは複数のhtmlファイルで構成されています(JavaScript、CSS、イメージ、その他)。リソースはMDM内からアクセスできる必要があります。 そのため、<TomcatPath>/webapps/の中に置く必要があります。<TomcatPath>はTomcatがインストールされているパスです。

手順

  1. <TomcatPath>/webapps/内にsmartviewという新しいフォルダーを作成し、WebテンプレートをProductという別の新しいフォルダー内(<TomcatPath>/webapps/smartview/Product/)に解凍します。
    これでフォームは、http://localhost:8180/smartview/Product/form.htmlを使用してアクセスできるようになりました。
  2. フォームをテキストエディターで開き、htmlエレメントをチェックします。
    XSLTはXMLで、XMLはhtmlほど甘くありません。終了タグのない開始タグが見つかります(metaimglink、その他)。全てのhtmlエレメントが開始タグと終了タグで書かれていることを確認します。
  3. URLをJS、CSS、およびイメージに修正します。全てのsrc属性を変更し、次をポイントするようにします: /smartview/Product/<resource> (<resource>だけでは不可。) たとえば:
    変更前:
    <script type="text/javascript" src="view.js"></script>
    
    変更後: <script type="text/javascript" src="/smartview/Product/view.js"></script>.
  4. データレコードの"デフォルト"スマートビューを作成するの説明に従ってスマートビュープロセスをTalend Studio内に作成し、Smart_view_Productという名前を付けます。
  5. <xsl:template match="/">を<xsl:template match="/Product">に変更します。エンティティがProductであるという想定です。
  6. htmlコードを<!DOCTYPE>なしでhtmlタグからコピーし、<xsl:template match="/Product">エレメント内に貼り付けます。<xsl:template>エレメント内に既にあったものは全て上書きします。
  7. <xsl:value-of>ステートメントを使用して、フィールド値をProductレコードから抽出した実際の値で設定します。XSLTに属性の出力を求めるには、<xsl:attribute>ステートメントを使用します。

タスクの結果

変更前のhtmlコードのサンプル:

<label class="description" for="element_2">Price
</label>
<div>
    <input id="element_2" name="element_2" class="element text   medium" type="text" maxlength="255" value=""/>
</div>

変更後:

<label class="description" for="element_2">Price
</label>
<div>
    <input id="element_2" name="element_2" class="element text medium" type="text" maxlength="255">
<xsl:attribute name="value"><xsl:value-of select="Price"/></xsl:attribute>
    </input>
</div>

XSLTはこれにより、<input>タグ内に"値"属性を発行して、この属性の値をProductレコードのPriceエレメントから取得するよう求められます。