pug模板循环yml文件里面的数组

在yml文件里面定义了数组变量如下

courseList:
  -
    type: 1对1课程
    img: ./images/index/course_1.png
    courses:
      - 1.******
      - 2.******
      - 3.******
      - 4.******
      - 5.******
    class:
      -
        - date: 2019-11
        - order: true
      -
        - date: 2019-10
        - order: true
      -
        - date: 2019-09
        - order: true
      -
        - date: 2019-08
        - order: false
      -
        - date: 2019-07
        - order: false

然后再pug里面循环这个数组

for item in local.courseList
          li.course-list-item
            img.course-list-item-img(src=item.img)
            .course-list-item-content
              h3.course-list-item-content-title 课程设置:
                for setting in item.courses
                  p.course-list-item-content-setting= setting
            ul.class-list
              li.class-list-item.list-tr
                .class-list-item-date 开班时间
                .class-list-item-type 开班类型
                .class-list-item-status 状态
              for classItem in item.class
                li.class-list-item
                  .class-list-item-date= classItem.date
                  .class-list-item-type= item.type
                  .class-list-item-status
                    span(class=`${classItem.order ? 'class-order' : 'class-over'}`)= `${classItem.order ? '预约' : '已结束'}`

classItem.date那里没有输出,当我把classItem.date换成classItem时,输出显示为[object, object],请问是pug模板不支持解析嵌套的数组吗?

项目使用的是gulp,里面关于html页面的配置如下

function readYamlFile(path) {
  let data = {};

  if (fs.existsSync(path)) {
    try {
      data = jsYaml.safeLoad(fs.readFileSync(path, 'utf-8'));
    } catch (error) {
      console.log(error);
    }
  }

  return data;
}

const injectPugData = file => {
  const filePath = file.path;
  const viewsDir = dirname(filePath);
  const globalDataPath = `${viewsDir}/data/global.yml`;
  const localDataPath = `${viewsDir}/data/${basename(filePath, '.pug')}.yml`;
  const globalData = readYamlFile(globalDataPath);
  const localData = readYamlFile(localDataPath);

  return Object.assign(globalData, { local: localData });
}

function views () {
  return (
    gulp
      .src(`src/views/*.pug`)
      .pipe($.plumber())
      .pipe($.data(injectPugData))
      .pipe($.pug(pugConfig))
      .pipe($.rename({ extname: '.html' }))
      .pipe($.formatHtml())
      .pipe(gulp.dest(`${destDir()}`))
  )
}
阅读 2.2k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题