Category "angular-material"

How to access an Angular Component using its injection token?

I'm working with Angular Material Drag and Drop. Material DnD is designed to create some components on the fly during the drag sequence. For instance the visual

Mat-Option selected option based on patch value from api subscription

In my case i have several controls with mat-autocomplete with mat-options. in which the same form is handled for new entry creation and edit an existing entry d

How to update html content of an element with angular function?

I have a table fulfilled with ngFor directive. Each line has a title, a badge (Material badge) and a button. I would like to change matBadge value when I click

ERESOLVE Error when installing Angular Material

I'm currently creating a project with Angular 13, the Ionic CLI, and Angular Material. I have no problem adding @angular/material when I don't use Ionic, but us

How to disable input outline in angular material

I use angular material mat-form-field and matInput. But input has this outline . How can i remove it? <mat-form-field appearance="outline" class="form__item

Angular Material Datepicker Selection Strategy - how to get value of selected date range

I'm trying to create a table which will display some info. The columns will be dynamically changing according to the selected date range. I'm using Date range p

Is it possible to make mat-grid-list direction to be right to left?

I am using mat-grid-list of Material in an Angular project. I would like that the mat-grid-tile items direction will be in right to left order (By default the o

Why My custom colors are not working in my Angular material theme?

I trying to add more color to my angular material theme, I've added the success color in my style.scss by the map.deep-merge fucntion // Custom Theming for Angu

Angular MatStepper fails to recognize cached values from two str arrays (but successfully recognizes values from another str array)

I have a MatStepper that's used to navigate to the next page of a signup flow. I also have a method that loads values from a cache if it's available, and if so

Angular material form field input - green border when input is valid

I am trying to change the border of a mat-form-field to green when the input is valid without overriding CSS classes and I was sure I am missing an easy trick.

How to disable typing but allow copy and paste in a text box in Angular 8?

I want to restrict typing in a text box but I need to paste anything inside that textbox in Angular

Store Object with Angular Autocomplete, not only Value in Input

Working on Angular, I created an Input with mat-autocomplete and mat-option (data comes from an Object Array, using NgFor). Properties of Object are ID, name an

mat-select is not level A compliant according to AInspector WCAG

I'm using Angular material in my website and trying to make it WCAG level A compliant. Doing some checks with the AInspector (extension for Firefox) seems the m

How to store hue from primary color pallete in global variables in angular material?

I am extracting 500 hue from primary pallete and I want to store that hue in global scss variable so that I can use it anywhere. But it is not working. My code:

How to close parent dialog depending on selected answer in confirm child dialog in Angular?

I'm trying to close a parent mat-dialog depending on the answer to a child confirm mat-dialog in Angular. The child confirm dialog says "You have unsaved chang

Angular 12 FormGroup dynamically Array checkboxes custom validator does not work

I am creating an Angular 12 app, with Material. I have a form with an checkbox array loaded dynamically from database. I need to validate that at least one chec

How to add branch lines to angular material table?

I am working on a UI (using Angular 10), where I have to show hierarchical structure inside a mat table. The HTML code is using mat table to show the data, and

mat-datepicker change date format not working

I am using the providers in my module to change the format of the datepicker in FiltriRecuperoComponent see code below export const MY_FORMATS = { parse: {

mat-icon text is showing in dropdown and icons in Angular

I tried using mat-icon in Angular in dropdown. But the text is shown first and after clicking dropdown it is showing the icons. I already tried importing in ind

How to display a value in mat-select without being inside mat-option?

In my case I'm using a formcontrolName with the mat-select. I would like to display a value on the mat-select, but not inside the dropdown list of options : <