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

Talend Studioユーザーガイド

Version
Cloud
7.3
Language
日本語
Product
Talend Big Data
Talend Big Data Platform
Talend Cloud
Talend Data Fabric
Talend Data Integration
Talend Data Management Platform
Talend Data Services Platform
Talend ESB
Talend MDM Platform
Talend Real-Time Big Data Platform
Module
Talend Studio
Content
ジョブデザインと開発
Last publication date
2024-03-20
対象製品...

Data Fabric

MDM Platform

このタスクについて

スマートビューは、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>

たとえば、PHPformを使ってフォームの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エレメントから取得するよう求められます。