Я хочу использовать диалоговое окно с предупреждением в моем angularjs приложении вместо всех $window.alert подарков. В каждый из контроллеров моего приложения я вставил (https://material.angularjs.org/latest/demo/dialog):
$scope.showAlert = function(ev) {
$mdDialog.show(
$mdDialog.alert()
.parent(angular.element(document.body))
.clickOutsideToClose(true)
.title('This is an alert title')
.textContent('You can specify some description text in here.')
.ariaLabel('Alert Dialog Demo')
.ok('Got it!')
.targetEvent(ev)
);};
и в моем стиле. css файл Я добавил это:
.md-dialog-is-showing {
top: 0 !important;
}
Проблема в том, что при вызове $ scope.showAlert страница в модальном диалоговом окне перемещается вверху, а при закрытии диалогового окна возвращается на предыдущую позицию. Как я могу предотвратить прокрутку наверх, чтобы вызвать диалог в том же месте, где он вызывается?
---------- EDITED ------- ---
Я пытался удалить добавленное правило css, но вся веб-страница, включая диалог, не отображается. Я заметил, что в теге body автоматически сгенерированный стиль был следующим (top: -1505px вызывает проблему)
<body ng-app="configuratorApp" class="ng-scope md-dialog-is-showing" style="position: fixed; width: 100%; top: -1505px; overflow: hidden;">
<md-backdrop class="md-dialog-backdrop md-opaque ng-scope" style="height: 2059px; position: fixed;" aria-hidden="true"></md-backdrop> ...