Як використовувати шаблон HTML

Шаблон HTML – це звичайний файл HTML, який містить деякі спеціальні вбудовані вирази (заповнювачі), які визначають відображення джерела вхідних даних у розмітці сторінки HTML. Заповнювачі, позначені подвійними фігурними дужками, вказують на області, куди слід вставляти фактичні дані з джерел даних. Aspose.HTML для .NET пропонує набір методів ConvertTemplate() для перетворення шаблону HTML у документ HTML, наповнений даними. Отже, давайте дізнаємося, як заповнити шаблон із джерела даних і перетворити його на файл HTML.

По-перше, переконайтеся, що у вашому проекті встановлено бібліотеку Aspose.HTML для .NET. Зробити це досить просто. Ви можете встановити її через консоль диспетчера пакетів NuGet за допомогою такої команди:


Встановіть Aspose.HTML для .NET

Install-Package Aspose.HTML

Джерело даних

Щоб створити та заповнити документ HTML із шаблону, вам знадобиться джерело даних для заповнення. Aspose.HTML надає синтаксис вбудованих виразів для роботи з шаблонами та різними типами джерел даних, такими як XML і JSON. Типове джерело даних у форматі XML може виглядати так:


Джерело даних XML

<Data>
    <Persons>
        <Person>
            <FirstName>Sherlock</FirstName>
			<LastName>Doe</LastName>
			<Address>
				<City>Dallas</City>
				<Street>Main rd.</Street>
				<Number>114</Number>
			</Address>
			<Telephone>012-5344-334</Telephone>
        </Person>
        <Person>
            <FirstName>Jack</FirstName>
            <LastName>Fox</LastName>
            <Address>
                <Number>25</Number>
                <Street>Broadway</Street>
                <City>New York</City>
            </Address>
            <Telephone>081-544-12-15</Telephone>
        </Person>
    </Persons>
 </Data>

Розмітка шаблону

Розмітка шаблону – це набір синтаксису, який використовується для вбудовування динамічного вмісту в шаблон HTML. Вбудовані вирази використовуються в шаблоні для виконання коду або виведення динамічних значень безпосередньо в документі HTML. Ось кілька простих правил для підготовки шаблону HTML для заповнення з джерела даних:

  • Вираз зв’язування даних використовується для встановлення значень елемента керування на основі інформації, яка міститься в джерелі даних із таким синтаксисом: {{ вираз зв’язування даних }}. Наприклад, такі вирази всередині шаблону, як {{FirstName}}, {{LastName}}, {{Address.Street}}, {{Address.Number}} і {{Telephone}}, вказують на поля з джерела даних, які потрібно вставити у відповідні комірки таблиці.
  • Атрибут data_merge вказує, що джерелом даних є список об’єктів, і таблицю слід повторювати для кожного об’єкта.
  • Вираз директиви foreach використовується для перебору списку елементів у поєднанні з виразом прив’язки даних.

Структура шаблону HTML

<!DOCTYPE html>
<html lang="en">
	<head>
		<title>Person Information</title>
	</head>
	<body>
		<table border=1 data_merge="{{#foreach Persons.Person}}">
			<tr>
				<th>Person</th>
				<th>Address</th>
				<th>Telephone</th>
			</tr>
			<tr>
				<td>{{FirstName}} {{LastName}}</td>
				<td>{{Address.Street}} {{Address.Number}}, {{Address.City}}</td>
				<td>{{Telephone}} </td>
			</tr>
		</table>
	</body>
</html>

Перетворення шаблону на HTML

Коли у вас є готовий шаблон HTML і файл джерела даних, ви можете об’єднати їх, тобто перетворити шаблон у файл HTML, наповнений даними. Aspose.HTML для .NET пропонує набір методів ConvertTemplate() для перетворення шаблону у документ HTML. Методи приймають кілька параметрів і повертають документ HTML. Скористаємося методом ConvertTemplate(HTMLDocument, TemplateData, TemplateLoadOptions, string) , який приймає чотири параметри:

  • Об’єкт HTMLDocument використовується як джерело для шаблону.
  • Об’єкт TemplateData містить дані, які будуть використані для заповнення шаблону.
  • Об’єкт TemplateLoadOptions надає параметри для завантаження шаблону.
  • Параметр string використовується для вказівки повного шляху файлу HTML як вихідного результату перетворення.

Код C# для перетворення шаблону у файл HTML

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Loading;
...

    // Initialize an HTML document as a conversion source (HTML template)
    var document = new HTMLDocument(Path.Combine(DataDir, "html-template.html"), new Configuration());

    // Define a TemplateData object
    var templateData = new TemplateData(Path.Combine(DataDir, "template-data.xml"));

    // Define a default TemplateLoadOptions object
    var options = new TemplateLoadOptions();

    // Prepare a path to the result file
    var resultPath = Path.Combine(OutputDir, "document.html");

    // Convert template to HTML
    Converter.ConvertTemplate(document, templateData, options, resultPath);

    // Clear resources
    document.Dispose();

Таблиця, заповнена даними з наведеного вище XML-файлу з використанням шаблону HTML, виглядатиме так:

Текст “Таблиця HTML, заповнена даними за допомогою шаблону”

Залежно від сигнатури методу ConvertTemplate() ви можете визначити джерело шаблону HTML із файлу, URL-адреси або вбудованого вмісту (string content). Ви також можете додати configuration як параметр.

Щоб дізнатися більше про Aspose.HTML API, відвідайте нашу документацію . У розділі Working with HTML Templates ви знайдете інформацію про те, як заповнити шаблон HTML із джерел даних XML або JSON, як перетворити шаблон на HTML, як встановити атрибути в шаблоні HTML і як контролювати наявність атрибутів під час заповнення шаблонів.