Popup géante - scroller en haut
Bonjour.
J'ai un souci avec un composant type popup (NgbModal) assez grande (sa hauteur est 3~4 fois plus grande que celle de la page) que j'affiche en cliquant sur un bouton.
Jusque là aucun souci, mais quand elle s'affiche, c'est sa partie basse qui apparaît, je dois scroller pour voir le haut du composant.
Comment je peux faire en sorte que quand le popup s'affiche, ce soit le haut du composant qui apparaisse ?
Dans le parent :
Code:
1 2 3 4 5
| @ViewChild('popup_help') private popup_help: HelpComponent;
openPopup() {
const options = { size: 'xl', centered: true };
this.popup_help.open(options);
} |
Dans le composent Popup (HelpComponent) :
Code:
1 2 3
| <ng-template #help_popup let-modal>
<!-- mon popup géant -->
</ng-template> |
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| import { Component, Injectable, TemplateRef, ViewChild } from '@angular/core'
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'
@Component({
selector: 'porp-popup_help',
templateUrl: './popup_help.component.html',
styleUrls: ['./popup_help.component.scss']
})
@Injectable()
export class HelpComponent{
@ViewChild('help_popup') private modalContent: TemplateRef<HelpComponent>;
private modalRef: NgbModalRef;
constructor(private modalService: NgbModal) {}
open(options: any) {
this.modalRef = this.modalService.open(this.modalContent, options);
this.modalRef.result.then();
}
} |