Stack Overflow
Stack Overflow

Questions tagged [angular-material2]

Angular Material is an implementation of Material Design in Angular 2+. DO NOT use this tag for AngularJS Material questions.

Tag usage

This tag should be used for questions regarding the Angular Material framework, and is typically used in conjunction with the tag.

For the older (and now deprecated as of January 2022) AngularJS Material framework, do not use this tag - use the and tags instead.

Project info

Angular Material, now part of a suite of Angular components made by the Angular team, is an official implementation of Google's Material Design guidelines for Angular.

Angular Material is officially out. The Angular Material team will release patches as Angular progresses and will follow the versioning of Angular.

Links

Notes

Current release: 14.2.2

2957 questions
63
votes
17 answers

Angular 2 Material 2 datepicker date format

I don't know how to change the date format of the material 2 datepicker. I've read documentation but I don't understand what I actually need to do. Output date format which datepicker provides by default is f.e.: 6/9/2017 What I'm trying to achieve…
Igor Janković
  • 5,494
  • 6
  • 32
  • 46
63
votes
3 answers

How to use .forRoot() within feature modules hierarchy

Can anyone please clarify to me how should I structure multiple nested feature modules hierarchy with .forRoot() calls? For example what if I have modules like this: - MainModule - SharedModule - FeatureModuleA - FeatureModuleA1 -…
ggabor
  • 1,642
  • 4
  • 18
  • 23
60
votes
8 answers

How to add data dynamically to mat-table dataSource?

I have data streaming from backend and i see it printing in console now i am trying to push event to dataSource its throwing error dataSource is not defined. Can someone help how to dynamically add data to materialize table…
hussain
  • 6,587
  • 18
  • 79
  • 152
60
votes
5 answers

Change size of textarea

I currently have a textarea like this: However, it is always the same size. Any idea on how to change the size of the textarea?
Nello
  • 1,737
  • 3
  • 17
  • 24
59
votes
7 answers

How to align button right inside Dialog angular material?

I want align button right corner of the dialog below is my html

What's your favorite animal?

user9450118
57
votes
12 answers

Set font size of Angular Material Tooltip

I am very new to web development, and I cannot figure out how to solve the following issue, although it may be very easy. I am using Angular 4 and Angular Material to implement tooltips like this:
GLR
  • 1,070
  • 1
  • 11
  • 29
54
votes
10 answers

Angular material design - how to add custom button color?

I want to add my own custom colors, similar to "primary", "warn" etc. For example, I added a class for an orange background, but I use it as a class and not as a color attribute. It works, but the code looks a bit confusing.
Shaniqwa
  • 1,924
  • 2
  • 17
  • 29
54
votes
6 answers

Can't bind to 'matDatepicker' since it isn't a known property of 'input' - Angular

I have just copied and pasted angular material code for datePicker and input, but I am getting this error for the datePicker. app.module import {MaterialModule} from '@angular/material'; @NgModule({ imports:…
edkeveked
  • 17,989
  • 10
  • 55
  • 93
54
votes
12 answers

Angular2 Material Dialog css, dialog size

Angular2 material team recently released the MDDialog https://github.com/angular/material2/blob/master/src/lib/dialog/README.md I'd like to change the looking and feel about the angular2 material's dialog. For example, to change the fixed size of…
ethan
  • 1,881
  • 2
  • 17
  • 31
53
votes
18 answers

How to implement drag and drop in cypress test?

I am struggling to test drag and drop with Cypress and Angular Material Drag and Drop. So the goal is to move "Get to work" from Todo to Done. I have created the following test, that should make it easy for you to reproduce: You can play with the…
DauleDK
  • 3,313
  • 11
  • 55
  • 98
52
votes
6 answers

Material Angular Accordion header/title height

So I've been trying to adopt Materials Accordion in my Web Application development. However having some troubles getting the header to expand in size as the content grows. My header is expected to have quite a few number of lines to give a summary…
Alex Sim
  • 617
  • 1
  • 6
  • 13
52
votes
19 answers

day incorrect in angular material datepicker

When I select a date I see the correct date in the field but, when I save, the datepicker send the day before the date I have selected ( 3 hours offset ) i am using angular reactive form and MatMomentDateModule for date picker . the problem is…
Motaz Homsi
  • 701
  • 1
  • 6
  • 9
52
votes
5 answers

Multiple mat-table with MatSort within the same component

I have 2 material 2 tables in the same component with sorting. I cannot find a way to assign the MatSort directive to its own table. I'm only able to use MatSort on the first table and the second table doesn't recognize there is a MatSort on it.…
Derek J.
  • 1,400
  • 1
  • 14
  • 23
52
votes
5 answers

How to get the active tab In Angular Material2

I want to get which tab is active. I tried to use a @ViewChild decorator and accessing the element properties that way, but it returns null. Component: import {Component, OnInit, ViewChild} from '@angular/core'; @Component({ selector:…
Runtime Terror
  • 6,242
  • 11
  • 50
  • 90
51
votes
10 answers

Cannot disable matInput element with [formControlName]

I'm using matInput and mat-form-field (@angular/material) in an Angular component, and I can't disable the matInput. A working example can be seen here. It seems likely that I'm missing something obvious, but for the life of me I can't figure out…
John
  • 9,249
  • 5
  • 44
  • 76
1 2
3
…
99 100