Nunjucks动态页面模板 [英] Nunjucks dynamic page template
本文介绍了Nunjucks动态页面模板的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用nunjucks(gulp)作为模板语言,我想构建一个动态页面模板。
i'm using nunjucks (gulp) as templating language and i want to build a dynamic page template.
这是我的Json:
"pages": [
{
uname: "Welcome",
title: "Page 1 Headline"
},
{
uname: "About",
title: "Page 2 Headline"
}
]
目前我每页都有一个静态页面(html)模板:
Currently i have a static page (html) template for each page:
{% extends "layout.html" %}
{% set active_page = "Welcome" %} //<- This needs to be dynamicly
{% block content %}
<h1>{{ page[0].title }}</h1> //<- This needs to be dynamicly
我的第一个想法是阅读url参数但是我无法用这种方式解决它。
My first thought was to read the url parameters but i couldn't solve it in this way.
有什么建议吗?
推荐答案
如果您希望从data.json文件传递数据
If you are hoping to pass the data from data.json file
- 首先需要使用一些来指定页面名称数据文件本身。
- 然后你必须在nunjucks页面中将页面名称设置为变量。
- 现在您可以使用此变量名来获取与您正在使用的
页面相关的数据。
data.json
{
"pages": {
"welcome": {
"uname": "Welcome",
"title": "Page 1 Headline"
},
"about": {
"uname": "About",
"title": "Page 2 Headline"
},
}
}
index.njk
{% set pageName = 'welcome' %}
{% extends "layout.html" %}
{% set active_page = "Welcome" %}
{% block content %}
<h1>{{ page[pageName].title }}</h1>
这篇关于Nunjucks动态页面模板的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文