Я использую Angular 9 и ngx- bootstrap 5.6.1
в моем файле angular ts У меня есть ссылка на локальный файл css.
в этом файле у меня есть css в моем классе .modal-content, который я хочу использовать для переопределения класса модального содержимого по умолчанию, предоставляемого ngx-bootstap. Такие вещи, как ширина и высота.
Когда я делаю это, это игнорируется. Через Chrome я вижу, что таблица стилей загружена. Поэтому я попытался добавить !important к каждому из моих значений, но это все равно не сработало. Затем я переместил css и поместил его в компонент html, но он все равно не работал.
Официальная документация показывает пользовательский класс для шаблона как:
this.modalRef = this.modalService.show(
template,
Object.assign({}, { class: 'gray modal-lg' })
);
Так что в моем файле ts я добавил , Object.assign({}, {class: 'modal-content'}) к своему звонку, чтобы показать, и все же это не будет работать. Я тогда переименовал класс и до сих пор не радуюсь. Если я добавлю свой класс модального содержимого в файл глобальных стилей. css, а затем сделаю:
this.modalRef = this.modalService.show(
template);
, шаблон будет отображаться правильно. Проблема в том, что стиль должен быть локальным, потому что другие модальные шаблоны должны иметь разные стили в зависимости от содержимого и т. Д. c. Итак, как мне переопределить .modal-content локально.