Попытка использовать один Angular компонент в качестве шаблона для нескольких HTML контента

Question

Я Angular ладья ie пытаюсь использовать одну компонентную @ comi c историю в качестве шаблона для нескольких комиксов, в конечном итоге для создания отдельных comi c URL (локальных для dev):

• http://localhost: 4200 / bottle красного цвета
• http://localhost: 4200 / откровение следующей миссии
• http://localhost: 4200 / i-did-nothing

Каждый комикс c представляет собой одну страницу с каруселью со сложным HTML:

<main>
	<section class="comic-book-story">
		<div class="container">
			<h1>Bottle of Red</h1>
			<p>...</p>
			<div id="" class="carousel">
				<div class="carousel-inner">
					<div class="carousel-item active">
						<p class="page-label">Bottle of Red: Page 1 of 7</p>
						<img>
						<div class="button-row">
							<a href="#">Previous</a>
							<a href="#">Next</a>
						</div>
						<div class="author-notes">
							<h2>About This Page</h2>
							<p>...</p>
						</div>
					</div>
					<div class="carousel-item">
						...
					</div>
					<div class="carousel-item">
						...
					</div>
				</div>
				<a class="carousel-prev"></a>
				<a class="carousel-next"></a>
			</div>
		</div>
	</section>
	<section class="comic-book-info text-page">
		<div class="container">
			<h2>Story Notes</h2>
			<p>...</p>
		</div>
	</div>				
</main>

Мое текущее дерево каталогов из приложения:

comi c -story / | - comi c -story.component. html | - comi c -story.component.s css | - comi c -story.component.spe c .ts | - comi c -story.component.ts

| - комиксы / | - | - bottle -of-red.component. html | - | - bottle -of-red.component.s css | - | - bottle -of-red.component.spe c .ts | - | - bottle -of-red.component.ts | - | - franks-next-mission.component. html | - | - franks-next-mission.component.s css | - | - franks-next-mission.component.spe c .ts | - | - franks-next-mission.component.ts | - | --Компонент i-did-nothing.com. html | - | - i-did-nothing.component.s css | - | - i-did-nothing.component.spe c .ts | - | - i-did-nothing.component.ts

мое дерево каталогов

Как лучше всего это подключить?

Answer 1

Вот ссылка на стек, показывающая, как я это делаю, используя Angular Router, stackblitz

Надеюсь, это поможет