Передайте CSS класс в Angular Библиотека

Question

Я создаю библиотеку, используя angular CDK для пользовательского модального режима. Я хочу, чтобы приложение, которое использовало бы библиотеку, передавало имя класса CSS с другой конфигурацией для модального окна. Чтобы я мог применить класс в библиотеке следующим образом.

  this.overlayContainer.getContainerElement().classList.add(modalConfig.overlayContainerClass);

Я вижу, что класс применяется к элементу, но класс отсутствует.

<div class="cdk-overlay-container overlay-material-design-theme mat-typography custom">

Я определил это в файле компонента приложения CSS.

.custom{
  width: 100%;
}

Вопрос в том, каким образом CSS, присутствующий в компоненте приложения, будет доступен компоненту библиотеки?

Answer 1

Чтобы классы css работали таким образом, вы должны поместить их в место, где нет инкапсуляции вида.

Место для этого обычно находится в src/styles.scss.

Если вам нужна дополнительная структура, вы можете получить их в другом файле s css, который src/styles.scss импортирует.