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
6
votes
2 answers

How can i build a custom angular component with the width settable in CSS?

This site states, that I can change the width of the side-nav with CSS like this: md-sidenav { width: 200px; } This arouses the following question for me: Can I apply the standard CSS properties like width, position, etc... to custom components…
Jonas Erbe
  • 177
  • 1
  • 12
6
votes
2 answers

.Net Core 2 Spa Template with Angular Material

Struggling trying to get Angular Material , or any 3rd party control set really, to work with this new template. In this new template, the webpack is broken into TreeShakable and NonTreeShakable. In addition the app.module is now…
Chris Oneslager
  • 121
  • 1
  • 6
6
votes
1 answer

Can initialize booking.com form 1 time but not again with ngOnInit

So I am using angular materials with angular4 and I have put html for a booking.com form inside an MdDialogue component. I want this dialogue to popup with the form inside of it when somebody pushes a button. It works as expected 1 time after the…
slipperypete
  • 5,358
  • 17
  • 59
  • 99
6
votes
2 answers

How to import Material Module or NgxBootstrap in Angular Universal?

Currently I am trying to build a project using Angular Universal. I'm using Angular 4. If I import Material Module - the project can be built, but when serving through ts-node an error appears -…
nomanbinhussein
  • 282
  • 5
  • 11
6
votes
1 answer

Submit Form in Angular4 and Material2

I tried to build my first login form with Angular 4.0.0 with Material 2. But the Form won't submit and trigger the function.
Budi
  • 678
  • 2
  • 6
  • 27
6
votes
2 answers

Angular-Material "md-datepicker" directive - "md-open-on-focus" issue

As exampled in this fiddle, there's seems to be an inconsistency issue with opening the md-datepicker multiple times when using md-open-on-focus. The problem occurs after opening and closing it for the first time (which works ok) - after that, it'll…
Shaya
  • 2,792
  • 3
  • 26
  • 35
6
votes
1 answer

Angular material align menu right

I have Angular material nav bar(shown below). I put a md-menu inside a nav bar because I want to achieve the bootstrap navigation bar that has dropdown menu on the right side. How can I move the "WELCOME! IVAN" which is a dropdown menu on the right…
aiipee
  • 252
  • 3
  • 9
  • 18
6
votes
2 answers

md-tabs Using code to goto a tab in angular 2 material design

I am using Angular2 to create an application i which i need to navigate between tabs using a button present inside the tabs. my html is as the following : …
skid
  • 958
  • 4
  • 13
  • 29
6
votes
2 answers

Expand collapse list item using angular material

Can anyone give any suggestions for adding an Expand/Collapse view shown here. I'd like to use Angular material with AngularJS only and not be dependant on Bootstrap etc however I can't find anything suitable in the AngularMaterial docs. Thanks
Adam
  • 532
  • 3
  • 11
  • 22
6
votes
1 answer

Styling md-tooltip (Angular Material 1.1.3)

I have a mat-tooltip that I was styling through a CSS like this: mat-tooltip .mat-content { // custom values, styling is not applied } However since 1.1.2 release of angular material this styling is not being applied to my tooltips. Has anybody…
joeCarpenter
  • 1,495
  • 4
  • 19
  • 32
6
votes
2 answers

Check if material2 sidenav is open

Is there a way to check if the sidenav element is open? According the API documentation, there is a isOpen? parameter, but in my case it throws an exception: EXCEPTION: Error in ./AppComponent class AppComponent - inline template:2:2 caused by:…
Runtime Terror
  • 6,242
  • 11
  • 50
  • 90
6
votes
1 answer

How to make angular material expandable?

I'm displaying dynamic content by looping with md-card tags. What I want to achieve is to show additional information when clicking on an md-card by expanding it like an accordion. Has anybody already tried this?
Jymbo
  • 296
  • 5
  • 18
6
votes
3 answers

mdbottomsheet disable drag down to close

I would like to disable the drag down to close gesture of mdbottomsheet. I've found a work around on scripts but I'm not sure where to put the code. Thanks for the help.
Edwin Bermejo
  • 432
  • 3
  • 5
  • 17
6
votes
6 answers

Adding HTML content to angular material $mdDialog

I have written the following piece of code to display some contents in angular material dialog box. it works fine when i add plain text to textContent . when i add HTML its displays HTML as text. how do i bind HTML to textContent This Works
Sha
  • 1,826
  • 5
  • 29
  • 53
6
votes
2 answers

Angular2 get values of dynamically created inputs

I have this input which are created dynamically from list column, now I need to get all values of the inputs when some method occurs( imagine getAllValues() )