Category "angular-material"

Angular error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class

ERROR in node_modules/@angular/material/dialog/dialog.d.ts:142:22 - error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an

Material Icon showing as the name when site first loads

There is an issue with Angular 7 and materials icon where the name of the icon shows when the site is initially loading. Is there a way to prevent this

MatTabGroup is not reliably showing pagination buttons

I am having an issue with the Angular Material Tabs component. I am trying to use the MatTabGroup with a handful of tabs in it. The problem is, when my componen

Changing starting position of mat-slider

I am working on mat-slider. I want to place thumb in middle and start sliding left and right. My code is as follows https://stackblitz.com/edit/angular-9unenq-u

Angular Material Table pagination not working, listing all rows even though the paginator is shown

I am trying to paginate an angular material table. The table at present is having dummy static data , in future once the backend api is ready it will be called

Angular Material Table filtering not refreshing

I have an Angular Material table... <div class="card"> <div class="card-header"> <b>{{ pageTitle }}</b> </div> <div

How to pick variation of Material color for styling an Angular Component

Is there a way to define which palette variation will be used when setting the color to accent(or primary)? For example I wish to set the background-color for

Chrome opens suggest password dialog on input with type number on MacOS?

I'm running into an issue similar to this one. I have autocomplete="off" on the entire form, and it does work correctly in Firefox, and most of the elements do

Angular mat-autocomplete: Setting active item programmatically

What are you trying to do? Setting an item in my panel active programmatically. What are you seeing that does not match your expectations? Using autocomplet

Translate mat-tab with i18n

I am using angular material tabs and I would like to know how could I translate the text of the tag using i18n. The structure of the tab is as follows: <mat-

Angular Material custom form field doesn't show mat-error

I thought I have almost the same example but somehow the control tricks me :-/ <form [formGroup]="form"> <app-ref-urlcheck [maxLen]="20" formContro

How can I format the Angular Material datepicker without moment.js dependency

What do I want to achieve? I want my Angular Material(v11) datepicker to use the DD-MM-YYYY format in an Angular version 11 project. What have I tried? I tried

Rendering Overlay Containers when theming Angular Material?

According to this tutorial we should be able to add the class needed to render the overlay container that backs Angular Material Select, Snackbar, etc. like thi

Bootstrap modal dialog is disabled in a project where Material modules are added

I am transferring my Bootstrap based Angular 11 project to Material based. Menu, Sidenav and new Material based components are working well. However my old Boot

.cdk-drag-preview not applying styles

I am using the cdk Drag and Drop from angular material, but the drag preview is not working as intended.. I want the preview to look exactly like the element be

mat-paginator breaks when mat-table is inside of NgIf

I have an angular project that is using mat-table and mat-paginator for a certain view, the problem is the view has a grid view and table view with a toggle, th

Is there any way to modify the MatDialog overlay order?

I want to implement basic dialog handling in my application, with 2 functions: To close all open dialogs: Easy with MatDialog.closeAll(); Enable the user to swi

display div on top of ngx-mapboxgl map

I'm trying to use ngx-mapbox-gl in an angular 7 app for the first time and am experiencing something strange with the map. I want to display some text and a but

textarea with angular material not size properly on launching page

I'm facing a weird issue that I cannot understand. When one of my page is displaying I have my textarea cut as we can see in this image But when I resize just

Hiding a mat data table column in angular 4

<ng-container matColumnDef="jan"> <mat-header-cell [hidden]="true" *matHeaderCellDef style="font-size: 65%" class="white-text" fxHide [fxShow.gt-md]=