Pug - 从JSON对象检索键

时间:2017-02-24 16:52:50

标签: javascript json pug

我正在尝试使用Pug的模板引擎和JSON作为数据库创建单页网站。最后,我想将我的不同“页面”存储在JSON文件中,然后在我的Pug模板中使用不同的变量/ mixin渲染该JSON,但我一直收到错误cannot read property "company" of undefined

非常感谢任何帮助。

这是我的Gulp任务,用于构建我的Pug文件,并将JSON传递到模板中:

// build the Pug files into HTML
gulp.task('build-pug', function buildHTML(){
  var dataFile = 'source/javascript/pages.json';
  return gulp.src('source/**/*.pug')
    .pipe(data(function(file){
      return JSON.parse(fs.readFileSync(dataFile));
    }))
    .pipe(pug({
      pretty: true
    }))
    .pipe(gulp.dest('public'))
    .pipe(browserSync.reload({
      stream: true
    }));
});

这是我的pages.json文件:

{
    "pages": [
        {
            "year": "2016",
            "company": "Abacus",
            "home": "./assets/images/2016/home/abacus.png",
            "home-url": "http://abacus.com",
            "login": "./assets/images/2016/login/abacus.png",
            "login-url": "http://abacus.com/login",
            "pricing": "./assets/images/2016/pricing/abacus.png",
            "pricing-url": "http://abacus.com/pricing"
        },
        {
            "year": "2016",
            "company": "Alfred",
            "home": "./assets/images/2016/home/alfred.png",
            "home-url": "http://alfred.com"
        }
    ]
}

这是在我的index.pug文件中,我试图从我的JSON中调用密钥:

section.pricing
    h1 Pricing Pages
    div.content.pricing

        each page in pages
            p= page.pages.company

1 个答案:

答案 0 :(得分:0)

如何用

替换index.pug中的最后一行

{{1}}