Применить две разные макеты для страницы входа

Question

В моем проекте Angular у меня есть несколько разных пользователей, которые используют два разных html для страницы входа (в зависимости от пользователя). Я могу создать уникальный шаблон html для входа в систему, а затем скрыть элементы, используя css, но я хотел бы знать, есть ли способ создания двух разных макетов для одной страницы входа.

например:

Login page:
   Layout one
   Layout two

Есть идеи?

Answer 1

да, вы можете, например, сделать 2 компонента макета, в которые вы встраиваете форму входа. В результате получается страница входа, которая выглядит следующим образом:

<LayoutRed *ngIf="isRed">
  <LoginForm></LoginForm>
</LayoutRed>


<LayoutBlue>
   <LoginForm></LoginForm>
</LayoutBlue>

В компонентах LayoutRed и LayoutBlue необходимо использовать <ng-content> для размещения формы в нужном месте.

Подробнее информация: - https://blog.angular-university.io/angular-ng-content/ - https://www.freecodecamp.org/news/everything-you-need-to-know-about-ng-template-ng-content-ng-container-and-ngtemplateoutlet-4b7b51223691/