разделить руль HTML на несколько файлов / разделов - PullRequest
Новая
       11

разделить руль HTML на несколько файлов / разделов

0 голосов
/ 24 июня 2018

Я хочу создать страницу только с одним маршрутом, но хочу разделить код HTML на несколько файлов.

При рендеринге этого маршрута я хочу, чтобы визуализированный файл получал содержимое из всех файлов шаблонов и объединял его на одной странице.

Например, этот шаблон должен отображать следующие файлы:

  • Заголовок
  • Введение
  • Услуги
  • О
  • Контакт
  • Выходные данные

Я просто хочу разделить код, потому что тогда я смогу создать чистую структуру. Это возможно? В настоящее время я просто могу сделать один файл 

router.get('/', (req, res) => {
    res.render('myTemplate');
});

Мне не нужно использовать Рули , если есть способ с логикой HTML по умолчанию, потому что у меня будет только один шаблон для моей страницы.

1 Ответ

0 голосов
/ 24 июня 2018

Предположим, вы хотите отобразить один файл, который является вашим основным файлом, и включить в него файлы верхнего и нижнего колонтитула. Давайте назовем ваш основной файл main.hbs и html-файлы верхнего и нижнего колонтитула как header.html и footer.html

Ваш код маршрута будет выглядеть следующим образом: 

    router.get('/', (req, res) => {
    res.render('main');
});

header.html 

<h1> Hi I'm the Header </h1>

footer.html 

<h1> Hi I'm the Footer </h1>

Вы можете включить шаблоны верхнего и нижнего колонтитула в основную страницу, используя jQuery

main.hbs 

<html>
<head>
<title></title>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script> 
$(function(){
  $("#header").load("header.html"); 
  $("#footer").load("footer.html"); 
});
</script> 
</head>
<body>
<div id="header"></div>
<!--Remaining section-->
<div id="footer"></div>
</body>
</html>

Аналогичным образом вы можете включить файлы Intro, Service, About, Contact, Imprint в основной файл, указав их идентификаторы.

...