포시코딩

[NestJS] hbs에서 Object 데이터 뿌려주기 본문

Node.js

[NestJS] hbs에서 Object 데이터 뿌려주기

포시 2023. 10. 12. 18:49
728x90

controller

@Get('/test')
  @Render('test')
  test() {

    const categories1 = [
      {
        name: '커피',
        subcategories: [
          { name: '생두', },
          { name: '원두', },
          { name: '로스터기', },
        ],
      },
      {
        name: '차',
        subcategories: [
          { name: '홍차', },
          { name: '녹차', },
        ],
      },
    ];

    const categories2 = [
      {
        name: 'test',
        subcategories: [
          { name: 'aa', },
          { name: 'bb', },
          { name: 'cc', },
        ],
      },
    ];

    return { categories1, categories2 };
  }

 

test.hbs

<html lang='en'>
  <head>
    <meta charset='UTF-8' />
    <meta name='viewport' content='width=device-width, initial-scale=1.0' />
    <title>Document</title>
  </head>
  <body>
    <h1>hi?</h1>

    <ul id="category-1">
      {{#each categories1}}
        <li>{{this.name}}</li>
        {{#if this.subcategories}}
          <ul>
            {{#each this.subcategories}}
              <li>{{this.name}}</li>
            {{/each}}
          </ul>
        {{/if}}
      {{/each}}
    </ul>

    <ul id="category-2">
      {{#each categories2}}
        <li>{{this.name}}</li>
        {{#if this.subcategories}}
          <ul>
            {{#each this.subcategories}}
              <li>{{this.name}}</li>
            {{/each}}
          </ul>
        {{/if}}
      {{/each}}
    </ul>
    
  </body>
</html>
728x90
저작자표시

'Node.js' 카테고리의 다른 글

[NestJS] TypeORM take, skip 버그  (4) 2023.10.30
[NestJS] Multer로 두 input에서 각각의 파일 받기(FileFieldsInterceptor)  (2) 2023.10.25
Table already exists when server restart in NestJS, TypeORM  (0) 2023.10.10
[Nest] set cookie-parser  (0) 2023.09.22
Express + TypeScript + Mongoose with. pnpm (2) - MongoDB Integration  (2) 2023.07.31
'Node.js' Related Articles more