Stack Overflow
Stack Overflow

Questions tagged [angular-material]

Angular Material is an implementation of Material Design in Angular. Do not use this tag for AngularJS Material, the implementation of Material Design for the older AngularJS framework.

Usage

  • This tag is intended for questions which ask about Angular Material
  • Please take note that you should use the tag for AngularJS 1.x Material questions instead of this tag.

Goal

Taken from the official repo:

The goal is to build a set of high-quality UI components built with Angular and TypeScript, following the Material Design spec. These components will serve as an example of how to write Angular code following best practices.

Asking a question

  • Mention the versions of Angular and Angular Material you're using.
  • Reduce your issue to a small example
  • Post a reduced working code on plnkr.co or stackblitz.com
  • If there's a bug (or some unintentional behavior), try to troubleshoot the problem. (If it's a bug report, please create a new issue at Angular Material's Github repository instead).

Learn more

To learn more about Angular Material, visit the following resources to help you get started:

19273 questions
122
votes
19 answers

Set default option in mat-select

I have a simple select option form field in my Angular material project: component.html Domain
cup_of
  • 6,397
  • 9
  • 47
  • 94
122
votes
20 answers

NullInjectorError: No provider for MatDialogRef

I can't inject MatDialogRef as it described in documentation: https://material.angular.io/components/dialog/overview When i'm trying to do it i'v got error: ERROR Error:…
rc21
  • 1,730
  • 2
  • 12
  • 14
117
votes
7 answers

How to pass data to dialog of angular material 2

I am using dialog box of angular material2. I want to pass data to the opened component. Here is how I am opening dialog box on click of a button let dialogRef = this.dialog.open(DialogComponent, { disableClose: true, data…
Sunil Garg
  • 14,608
  • 25
  • 132
  • 189
115
votes
6 answers

Angular material: MatDatepicker: No provider found for DateAdapter

I'm trying to use the Datepicker component in Angular Material. Here is my HTML code: However, it's not…
ajgisme
  • 1,615
  • 2
  • 14
  • 28
113
votes
14 answers

Angular 5 FormGroup reset doesn't reset validators

I have a form on my page and when I call FormGroup.reset() it sets the forms class to ng-pristine ng-untouched but FormControl.hasError(...) still returns truthy. What am I doing wrong here? Template
efarley
  • 8,371
  • 12
  • 42
  • 65
112
votes
14 answers

Property 'fName' comes from an index signature, so it must be accessed with ['fName']

These are my files. I am getting this error can someone help me. Error: src/app/app.component.html:5:123 - error TS4111: Property 'fName' comes from an index signature, so it must be accessed with ['fName'].
Chaitanya Chitturi
  • 1,129
  • 2
  • 7
  • 8
109
votes
13 answers

Confirm password validation in Angular 6

I want to perform password and confirm password validations using material components only,and an error message below the confirm password field if confirm password field doesn't match And if it is empty.Tried many resources unable to…
Shankar
  • 2,565
  • 8
  • 29
  • 56
106
votes
24 answers

How to change height in mat-form-field

How can I change height in mat-form-field with appearance="outline"? I need to reduce the mat-form-field. My input example
Stack Overflow
  • 2,416
  • 6
  • 23
  • 45
103
votes
12 answers

How to change mat-icon size in Material

This question comes from the Material2 Github repo. I still have problems to style a Material component that is wrapped in a custom component. I have a component that contains Adding: :host { .mat-icon…
Mackelito
  • 4,213
  • 5
  • 39
  • 78
98
votes
36 answers

Angular MatPaginator doesn`t get initialized

I have 2 components. Both have mat-table and paginators and pagination is working for one component and not working for the other component though the code is similar. Below is my html:
Nagendra Varma
  • 2,215
  • 3
  • 17
  • 26
97
votes
6 answers

How to add icon to mat-icon-button

I am using Angular with Material I am trying to add an icon to button, but I can't figure out how to do it, and can't find documentation for…
Alexander Mills
  • 90,741
  • 139
  • 482
  • 817
97
votes
8 answers

Angular Material and Jasmine : " No provider for InjectionToken MdDialogData! "

I have a component which is meant to be used in an Angular Material MdDialog : @Component({ ... }) export class MyComponent { constructor(@Inject(MAT_DIALOG_DATA) public data: any, public dialogRef: MdDialogRef) { ... } } I…
Wenneguen
  • 3,196
  • 3
  • 13
  • 23
97
votes
7 answers

Angular Material and changing fonts

Just wondering how I can change default fonts in Angular Material ... The default is Roboto and I couldn't find a way to change this to different font.
Nav
  • 4,450
  • 10
  • 53
  • 84
95
votes
11 answers

Styling mat-select in Angular Material

How to style mat-select's panel component. From the docs I get that I need to provide panelClass so I make it like this:
Marcin Kapusta
  • 5,076
  • 3
  • 38
  • 55
93
votes
17 answers

How to remove space bottom mat-form-field

I use angular 7 with angular material and i want to remove the space bottom as you can see. I tried many way but no sucess.
user9714967
  • 1,534
  • 3
  • 13
  • 21
1
2
3
…
99 100