超载块与dust.js嵌套模板

我有一个布局称为layouts/master.dust超载块与dust.js嵌套模板

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>{+title /}</title> 
    <link rel="stylesheet" href="css/app.css" /> 
</head> 
<body> 
<div id="wrapper"> 
    <h3>This is the master header</h3> 

    {+body /} 
</div> 

</body> 
</html>

然后我有一个模板称为index.dust：

{>"layouts/master" /} 

{<body} 
    <h1>{@pre type="content" key="greeting"/}</h1> 
{/body}

可以预见的是，输出

这是主标题

你好，亚历克斯！

（当有关JSON提供）

我的问题是，我创建了另一个 “嵌套” 或 “子” 的模板：layouts/admin.dust，看起来像：

{>"layouts/master" /} 

<h4>This is an admin header</h4> 

{+body /}

和使用layouts/admin/dust这样的模板adminIndex.dust：

{>"layouts/admin" /} 

{<body} 
    <p>This is some stuff for admin</p> 
{/body}

我的问题，是outpu t是：

这是主标题
这是一些工具和管理

这是管理员头部

这是一些工具和管理

所以，我的{+body}块被调用两次，并且不会被我的嵌套模板覆盖

有没有办法做到这一点？

编辑

按我的评论中，admin.dust更“现实”的例子是：

{>"layouts/master" /} 

<h4>This is an admin header</h4> 

<div style="float: left; width: 200px;"> 
<strong>left nav</strong> 
<ul> 
    <li>Link one</li> 
    <li>Link two</li> 
    </ul> 
</div> 

<div style="float: right"> 
    {+ body /} 
</div>

凡在使用admin布局模板，其body是一个div右移（例如）

来源

2014-02-20 Alex

您的{+body}块正被您的{<body}覆盖内联部分在您的adminIndex.dust模板。内联部分的内容（在您的案例中为<p>This is some stuff for admin</p>）将插入到您的模板中找到块的任何位置。如果你希望有主标题由管理员头部被替换，你需要你的模板看起来像这样：

layouts/master.dust

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>{+title /}</title> 
    <link rel="stylesheet" href="css/app.css" /> 
</head> 
<body> 
<div id="wrapper"> 
    {+header}<h3>This is the master header</h3>{/header} 

    {+body /} 
</div> 

</body> 
</html>

layouts/admin.dust

{>"layouts/master" /} 

{+header}<h4>This is an admin header</h4>{/header}

adminIndex.dust不需要改变。

注：我已经添加了一个{+header}块layouts/master.dust具有默认值，并增加了一个{header}直列部分和从layouts/admin.dust除去{+body}块。这将输出：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <link rel="stylesheet" href="css/app.css" /> 
</head> 
<body> 
<div id="wrapper"> 
    <h3>This is the admin header</h3> 


     <p>This is some stuff for admin</p> 

</div> 

</body> 
</html>

来源

2014-02-20 18:28:32 smfoote

感谢您的回答。在现实中，admin.dust将包含2栏布局，左侧是一个“导航”区域，右侧是“身体”或内容...有在admin.dust中指定应该呈现正文的方式？ – Alex

我编辑了我的admin.dust模板以反映上述注释 – Alex

您是否可以为管理员和非管理员页面添加您期望的输出结果（包括HTML）？ – smfoote

超载块与dust.js嵌套模板

回答

相关问题