Рули: html печатает в консоли, но не рендерит - PullRequest
Новая
       8

Рули: html печатает в консоли, но не рендерит

1 голос
/ 11 марта 2020

Я создаю приложение на express и руле. Я пытаюсь разрешить пользователю вводить поисковый термин, который затем вызывает следующее:

  1. Поисковый термин передается в маршрут на моем сервере
  2. Этот маршрут выполняет вызов к внешнему API через топор ios
  3. Данные возвращаются, и рули выводят их на страницу «результатов поиска».

Рули получают данные и создают идеальный html документ, который по какой-то причине не отображается в окне браузера. Однако, если я открою инструменты разработчика браузера, go для «сети», нажмите на запрос, а затем «Предварительный просмотр», я увижу страницу, которую я хотел бы отобразить. Я подозреваю, что направляю руль res.render в неправильном направлении, но я не уверен, как это исправить.

У меня есть файл search.js, связанный со страницей html, которая дает пользователю строка поиска: 

$(document).ready(function() {
  $("#searchButton").on("click", function() {
    const query = $("#recipeSearch")
      .val()
      .trim();
    const search = { searchTerm: query };

    $.ajax({
      url: "/api/search",
      method: "POST",
      data: search
    }).then(result => console.log(result));
  });
});

Тогда в моих маршрутах у меня есть маршрут сообщения, определенный так: 

app.post("/api/search", function(req, res) {
    let searchTerm = req.body.searchTerm;
    let apiKey = process.env.SPOON_APIKEY;
    let queryUrl = `https://api.spoonacular.com/recipes/search?query=${searchTerm}&apiKey=${apiKey}`;

    axios.get(queryUrl).then((results) => {
      // then render the retrieved data to a handlebars page
      res.render("search-results", { recipes: results.data.results });
    });
  });

файлы рулей: 

views/
  search-results.handlebars
  layouts/
    main.handlebars

search- Результаты содержат следующее: 

<ul>
  {{#each recipes }}
  <li>{{this.title}}</li>
  {{/each}}
</ul>

Результат в инструментах разработчика браузера выглядит следующим образом: https://imgur.com/NTdDYvy.png

Чего мне не хватает? Пожалуйста, дайте мне знать, если вам нужна дополнительная информация. Спасибо!

...