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 homecomponent.ts : Sélectionner tout - Visualiser dans une fenêtre à part
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 helpcomponent.html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 <ng-template #help_popup let-modal> <!-- mon popup géant --> </ng-template>
Code helpcomponent.ts : Sélectionner tout - Visualiser dans une fenêtre à part
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(); } }
Partager