Angular NBG Modal появляется в нижней части экрана ⇐ Javascript

[Anonymous]

У меня есть угловое приложение, использующее ngbmodal из ng-bootstrap, но модал появляется неправильно: вместо центрирования и перекрытия родителя он отображается в нижней части экрана под родительским компонентом. < /p>
Инверсировать компьютерные стили модала в Devtools показывает, что его не хватает, ожидаемая позиция, как позиция: фиксированная позиция: фиксированная позиция: фиксированная позиция: фиксированная позиция: фиксированная позиция, фиксированная, и фиксированная позиция, фиксированная, и фиксированная, и фиксированная позиция, фиксированные, и фиксируют позицию: фиксированная позиция, а абсолютная, а абсолютная позиция, фиксированная, и фиксированная позиция: фиксированная позиция. Перевод (-50%, -50%), который NG-BootStrap обычно применяется к центральным модалам. Единственные правила CSS, которые я могу найти на модале или его родителях,-это стили шрифта и маржи /заполнения-ничего о позиционировании. < /P>
Я подозреваю, что либо модальные CSS из NG-Bootstrap отсутствуют, не загружены правильно,
Add User

...

import {NgbModal} from "@ng-bootstrap/ng-bootstrap";
export class UsersComponent implements OnInit {

constructor(
private modalService: NgbModal
) { }

openNewUserModal(user: User | null = null) {
const modalRef = this.modalService.open(UserModalComponent);
}
< /code>
Child: < /p>

User Modal

Hello, minimal modal!

Save

...

import {NgbActiveModal} from "@ng-bootstrap/ng-bootstrap";

@Component({
selector: 'app-user-modal',
templateUrl: './user-modal.component.html',
styleUrls: ['./user-modal.component.scss']
})
export class UserModalComponent implements OnInit {

constructor(public activeModal: NgbActiveModal) { }

}

< /code>
Не существует пользовательских CSS для модала сейчас.@import "~@angular/material/prebuilt-themes/indigo-pink.css";
< /code>
2.) В моем файле Angular.json моя конфигурация сборки включает в себя как файлы CSS, так и Bootstrap's CSS: < /p>
"styles": [
"./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.scss"
],
< /code>
Это в настоящее время мой index.html. Я не верю, что мне нужно что -то здесь делать, но я прочитал некоторые ответы, предлагающие попробовать некоторые вещи здесь, и я попробовал все только, чтобы еще не испортить другие стили, поэтому я не трогал это. Я открыт для предложений. < /P>




TIMS













Подробнее здесь: https://stackoverflow.com/questions/797 ... the-screen