как объединить имя json и URL в качестве представления в express.js

#node.js #express

#node.js #экспресс

Вопрос:

Я учусь использовать express.js фреймворк и пока все так хорошо. Однако я столкнулся с проблемой. У меня есть файл json с объектами и элементами объекта. Элементы объекта включают **categoryName** в себя и **linkURL** . Я пытаюсь написать функцию, которая анализирует эти два элемента как представление ссылок. Вот что я пробовал: это файл json

 {
  "categoryName": "Appetizers amp; Sides",
  "categories": [
    {
      "categoryID": "294",
      "parentID": "304",
      "subjectID": "7",
      "categoryName": "Apps and Side Dishes (Laura)",
      "categoryDescription": "Learn to make amazing appetizers and side dishes with Laura in the Kitchen.",
      "videosCount": "101",
      "forumCategoryID": "163",
      "linkURL": "https://thenewboston.com/guide/introduction"
    },
    {
      "categoryID": "285",
      "parentID": "304",
      "subjectID": "7",
      "categoryName": "Side Dishes",
      "categoryDescription": "Side dish recipes for salads, vegetables, sauces with Hilah cooking.",
      "videosCount": "38",
      "forumCategoryID": "163",
      "linkURL": "https://thenewboston.com/guide/introduction"
    },
    {
      "categoryID": "337",
      "parentID": "304",
      "subjectID": "7",
      "categoryName": "Side Dishes (bt)",
      "categoryDescription": "Side dish recipes with Byron Talbott.",
      "videosCount": "5",
      "forumCategoryID": "163",
      "linkURL": "https://thenewboston.com/guide/introduction"
    },
    {
      "categoryID": "301",
      "parentID": "304",
      "subjectID": "7",
      "categoryName": "Side Dishes for Barbecue",
      "categoryDescription": "Barbecue side dish recipes done on the grill by the BBQ Pit Boys!",
      "videosCount": "43",
      "forumCategoryID": "163",
      "linkURL": "https://thenewboston.com/guide/introduction"
    },
    {
      "categoryID": "297",
      "parentID": "304",
      "subjectID": "7",
      "categoryName": "Soups and Salads (Laura)",
      "categoryDescription": "Looking for the perfect recipe to start your meal? Or are you looking to eat something on the lighter side? These are sure to have you covered!",
      "videosCount": "70",
      "forumCategoryID": "163",
      "linkURL": "https://thenewboston.com/guide/introduction"
    }
  ]
}

И это мой файл маршрутизатора

 var express = require('express');
var router = express.Router();
var vd = require('../videodata.json')

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' , videodata: vd});
});

module.exports = router;

И это то, что я пытался сделать в своем ejs-файле

 <html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
  <% include templates/header.ejs%>
    <h1><%= videodata.categoryName %></h1>
  <ul>
    <% videodata.categories.forEach(function(item){  %>
      <li><%=
          // TO DO: CREATE LINK TO APPEAR ON WEBSITE
          const a = document.createElement('a');
          a.href = item.categoryName;
          a.innerText = item.linkURL;
          document.body.appendChild(a);
        %></li>
    <% }); %>
  </ul>
  </body>
</html>

Итак, мой вопрос в том, как мне изменить ejs для отображения списка ссылок, например:

Название категории
Имя каждой категории как ссылка на linkURL ?

1. Привет, @Mavrick, я думаю, вы привязали неправильное значение к атрибуту href, не могли бы вы заменить его на .href =item.linkURL и попробовать.

2. Да, исправлена ошибка, которая все еще не работает. Говорит: SyntaxError: неожиданный токен ‘const’ в C:UsersuserDesktopNode.jsexpressviewsindex.ejs во время компиляции ejs

3. Можете ли вы попробовать так, <li> <a href=»<%= item.linkURL %>»><%= item.CategoryName %></a> </li>

Ответ №1:

Вы можете использовать приведенный ниже код для отображения списка ссылок

 <html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
  <% include templates/header.ejs%>
    <h1><%= videodata.categoryName %></h1>
  <ul>
    <% videodata.categories.forEach(function(item){  %>

      <li> <a href="<%= item.linkURL %>"><%= item.categoryName %></a> </li> 

    <% }); %>
  </ul>
  </body>
</html>