Question

我正在使用XSLT从配置文件生成行，列和内容。我有配置行/列/内容的配置程序，但无法弄清楚如何使XSLT重复行和列以匹配预期的HTML输出。它只是拉出每个Row / Col / Box的第一个实例。我知道有一些参数可以传递以使其正确重复，但是我不知道如何正确使用它们。

XSLT文件：

<xsl:template match="/XmlPages">
    <xsl:for-each select="/XmlPages/Page[@RouteUrl=$RouteUrl]">
        <xsl:apply-templates />
    </xsl:for-each>
</xsl:template> 

<xsl:template match="Row">      
    <div class="row content-row">
        <xsl:apply-templates select="Col" />
    </div>
</xsl:template>

<xsl:template match="Col">
    <div class="col-{@colSize} content-col">
        <xsl:apply-templates select="Box" />
    </div>
</xsl:template>

<xsl:template match="Box">      
    <div class="content-box {@boxBg}-bg" data-url="{@fileUrl}"></div>
</xsl:template>

配置文件：

<Page Name="testPage" RouteUrl="/testPage">
    <Row>
        <Col colSize="3">
            <Row>
                <Col colSize="12">
                    <Box boxBg="clear" fileUrl="/content/test-1.html"></Box>
                </Col>
            </Row>
            <Row>
                <Col colSize="12">
                    <Box fileUrl="/content/test-2.html"></Box>
                </Col>
            </Row>
            <Row>
                <Col colSize="12">
                    <Box fileUrl="/content/test-3.html"></Box>
                </Col>
            </Row>
        </Col>
        <Col colSize="9">
            <Row>
                <Col colSize="9">
                    <Box fileUrl="/content/test-4.html"></Box>
                </Col>
                <Col colSize="3">
                    <Row>
                        <Col colSize="12">
                            <Box boxBg="color" fileUrl="/content/test-5.html"></Box>
                        </Col>
                    </Row>
                    <Row>
                        <Col colSize="12">
                            <Box boxBg="color" fileUrl="/content/test-6.html"></Box>
                        </Col>
                    </Row>
                </Col>
            </Row>
            <Row>
                <Col colSize="12">
                    <Box fileUrl="/content/test-7.html"></Box>
                </Col>
            </Row>
        </Col>
    </Row>
</Page>

所需的HTML结果：

<div class="row content-row">
    <div class="col-3 content-col">
        <div class="row content-row">
            <div class="col-12 content-col">
                <div class="content-box clear-bg">
                </div>
            </div>
        </div>
        <div class="row content-row">
            <div class="col-12 content-col">
                <div class="content-box">
                </div>
            </div>
        </div>
        <div class="row content-row">
            <div class="col-12 content-col">
                <div class="content-box">
                </div>
            </div>
        </div>
    </div>
    <div class="col-9 content-col">
        <div class="row content-row">
            <div class="col-9 content-col">
                <div class="content-box">
                </div>
            </div>
            <div class="col-3 content-col">
                <div class="row content-row">
                    <div class="col-12 content-col">
                        <div class="content-box color-bg">
                        </div>
                    </div>
                </div>
                <div class="row content-row">
                    <div class="col-12 content-col">
                        <div class="content-box color-bg">
                        </div>
                    </div>
                </div>              
            </div>
        </div>
        <div class="row content-row">
            <div class="col-12 content-col">
                <div class="content-box">
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

您忘记了您的Col元素也可以有Row个孩子。
所以改变

<xsl:template match="Col">
  <div class="col-{@colSize} content-col">
    <xsl:apply-templates select="Box" />
  </div>
</xsl:template>

到

<xsl:template match="Col">
  <div class="col-{@colSize} content-col">
    <xsl:apply-templates select="Row|Box" />
  </div>
</xsl:template>

应该可以解决问题。
如果输出不同，也可以创建一个新模板。

使用XSLT生成重复的Bootstrap网格行和列时出现问题

1 个答案: