Я пытаюсь интегрировать шаблон начальной загрузки в мой угловой проект, в котором также используется начальная загрузка.Это мой проект Angular: ![enter image description here](https://i.stack.imgur.com/SKzRk.png)
И это шаблон прокрутки "Etheral", который я пытаюсь интегрировать в первый раздел панели инструментов: ![enter image description here](https://i.stack.imgur.com/5dkWr.png)
![enter image description here](https://i.stack.imgur.com/gQxji.png)
Я просто переместил файлы и папки Ethereal в папку компонентов Dashboard и заменил код внутри dashboard.component.html на код внутриindex.html.
![enter image description here](https://i.stack.imgur.com/1rS0B.png)
Мне хорошо известно, что это неправильный метод, но я просто пытаюсь проверить, могу ли я интегрировать шаблон Ethereal или нет.
Итак, вот мой файл dashboard.component.html:
<!--
Ethereal by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>Ethereal by HTML5 UP</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<!-- <link rel="stylesheet" href="assets/css/main.css" /> -->
<!-- <noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript> -->
</head>
<body class="is-preload">
<!-- Page Wrapper -->
<div id="page-wrapper">
<!-- Wrapper -->
<div id="wrapper">
<!-- Panel (Banner) -->
<section class="panel banner right">
<div class="content color0 span-3-75">
<h1 class="major">Hello, my name<br />
is Ethereal</h1>
<p>This is <strong>Ethereal</strong>, a free site template by AJ for <a href="https://html5up.net">HTML5 UP</a>. It’s fully responsive, built on HTML5 and CSS3, and released entirely for free under the Creative Commons license. Hope you dig it :)</p>
<ul class="actions">
<li><a href="#first" class="button primary color1 circle icon fa-angle-right">Next</a></li>
</ul>
</div>
<div class="image filtered span-1-75" data-position="25% 25%">
<img src="images/pic01.jpg" alt="" />
</div>
</section>
<!-- Panel (Spotlight) -->
<section class="panel spotlight medium right" id="first">
<div class="content span-7">
<h2 class="major">Sed etiam aenean</h2>
<p>Mauris et ligula arcu. Proin dapibus convallis accumsan. Lorem maximus hendrerit orci, sit amet elementum massa hendrerit sed. Donec et ullamcorper ligula. Suspendisse amet potenti. Ut pretium libero eleifend euismod sed tristique. Quisque dictum magna risus, id ultricies justo sagittis vitae. Sed id odio tempor, porttitor elit amet, gravida hendrerit fringilla lorem ipsum dolor.</p>
</div>
<div class="image filtered tinted" data-position="top left">
<img src="images/pic02.jpg" alt="" />
</div>
</section>
<div class="copyright">© Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>.</div>
</div>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
Я взял только первые два раздела файла index.html только для проверки всего этого.
Однако приложение недаже не начинать, если я не закомментирую эти две строки в начале html-файла.
<!-- <link rel="stylesheet" href="assets/css/main.css" /> -->
<!-- <noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript> -->
И, очевидно, это делает файл dashboard.component.html без какого-либо стиля.
Если кто-то можетобъясните мне: * 1 / Почему сбой приложенияhs, когда я добавляю две линии стиля?
2 / Как лучше всего интегрировать шаблон "Ethereal" в мой проект начальной загрузки / angular?
3 / Как я могу это исправить, если это возможно?
Ответ на любой из этих вопросов будет много значить для меня.
Спасибо!