Stack Overflow
Stack Overflow

Questions tagged [mat-dialog]

145 questions
13
votes
3 answers

How to communicate from mat dialog component to the component where mat dialog is implemented?

I have a dialog component and app component where the material dialog is implemented. Here is the code of app component import { Component } from '@angular/core'; import {VERSION, MatDialog, MatDialogRef} from '@angular/material'; import {…
karty
  • 187
  • 1
  • 1
  • 10
7
votes
2 answers

mat-dialog changes css unexpectedly in Angular Material 15

Since Angular Material 15, the content of the mat-dialog has some weird css: .mat-mdc-dialog-container .mdc-dialog__content { color: var(--mdc-dialog-supporting-text-color, black); } .mat-mdc-dialog-container .mdc-dialog__content { …
Snaketec
  • 471
  • 2
  • 14
6
votes
1 answer

Angular Material theming / changing border radius

I am using Angular Material with a theme. $my-theme-redish: (... $my-theme-red: (... $my-theme-celeste: (... $my-theme-primary: mat-palette($my-theme-redish); $my-theme-accent: mat-palette($my-theme-celeste); $my-theme-warn: …
Andresch Serj
  • 35,217
  • 15
  • 59
  • 101
6
votes
2 answers

Logout MatDialog not working in mobile browsers

I want to alert user if he is idle for 20 min. So, created a service. It is working fine with desktop but in mobile phone its not showing up and sometimes if screen left in the background for couple of hours, then logout dialog screen started the…
Kartheek Sarabu
  • 3,886
  • 8
  • 33
  • 66
5
votes
2 answers

Angular Mat dialog unit test: This.dialogref.updatesize is not a function

I am new to angular. I am trying to write a unit test for mat dialog but it throws error. My method in ts file : isMobileScreen= Observable= this.breakpointObserver.observe('(max-width:600px)'); OpenDialog(){ …
Muthukani K
  • 151
  • 1
  • 15
5
votes
3 answers

Angular Material: Mat Table sometimes get updated in real-time sometimes not

I've a Mat Table which calls a GET request. Also I've a Mat Dialog which takes data and on Save click calls POST request. Everything is working fine but the table sometimes get updated after I click the Save button but sometimes not (I've to reload…
Avishek
  • 524
  • 16
  • 38
3
votes
2 answers

Angular 11+ MatDialog: inner component's (ngComponentOutlet) html does not trigger

In fact, I'm having more issues with the ngComponentOutlet-embedded component inside the MatDialog. But let's start here. What I'm building I want to display an arbitrary Component inside a MatDialog. I've found a way, but while it works on Angular…
netikras
  • 422
  • 4
  • 12
3
votes
1 answer

How can i change the Z-Index of mat-dialog in Angular

My app uses multiple mat-dialogs and sometimes it can happen that 2 are displayed at same time which causes a problem as the second one is never displayed correct and since its modal renders the app useless. After some more research it seems i can…
NoSoup4you
  • 640
  • 1
  • 10
  • 34
3
votes
0 answers

How to create dynamic custom style on mat -dialog on each mat-table row with top triangle in Angular - Material

Here is my sample code. Please find my working sample code here I need to set triangle on right top corner in mat-dialog box - Angular. I am getting top right corner triangle dialog box using static css on last row. But here not able to get on each…
Mit Jacob
  • 159
  • 1
  • 15
3
votes
1 answer

How can I set position of a dialog box under the button click event of each row in Mat table?

Here is my sample code. I created code here please see my working code here I tried to set up a position for a dialog box dialogConfig.position = { top: '370px',left: '500px'} But for each row it's opening at the same position. Here, I need to…
Mit Jacob
  • 159
  • 1
  • 15
3
votes
2 answers

How to test MatDialog is opened using mock in angular unit test

I am currently using a component, in which on button click a pop-up will be opened to greet user. I am using angular Material Dialog for opening pop-up and the component code block which will call on click is public openMatDialog(): void…
Prem Kumar
  • 39
  • 1
  • 6
3
votes
0 answers

How to show FormGroup with some controls in a MatDialog

I have a CustomDialog and I use it as a confirm dialog box and show my external component in it as a modal dialog. I wanted to inject a dynamic formGroup that created in TS file in it. Before I used Metro4 component that has a method in dialog…
HamidFaridi
  • 33
  • 4
3
votes
3 answers

Open several mat-dialogs one by one after the previous one is closed

In my code I have a button which will browse a list of data and open a mat-dialog for each data. Unfortunately, during the course of the loop, all the mat-dialogs open. What I would like to happen is that by using the dialogRef.afterClosed() method,…
Quentin
  • 1,865
  • 2
  • 24
  • 40
3
votes
2 answers

How to close Angular material dialog box?

I am using Angular 8. I am reading a svg file and find elements with style has stroke:none. Then open a dialog box whenever someone hover that element. Dialog box is opening but it is not closing when I click on outside or close button. I tried…
neomal
  • 95
  • 1
  • 1
  • 8
2
votes
1 answer

Why do I get compilation errors when trying to use Angular elements in a Material Dialog?

I have tried to create a very basic instance of an Angular application with a Material Dialog, but when I try to incorporate anything "Angular" in the HTML of the dialog (such as using or [(ngInput)]), it fails to compile. In…
Ben O'Leary
  • 101
  • 7
1
2 3
…
9 10