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 to enable or disable input fields dynamically in angular js material design

I am having an issue with ng-disable. as i am using angular material i think this is not working. I want my input box to be disabled or enabled dynamically based on condition. Note:- I have multiple input fields i want disable or enable all of the…
Hemanth Paluri
  • 363
  • 3
  • 5
  • 12
6
votes
3 answers

Angularjs : Scroll to bottom of div

I'm having trouble scrolling to last message. var app=angular.module('myApp', ['ngMaterial'] ); app.controller('ChatCtrl', function($window, $anchorScroll){ var self = this; self.messageWindowHeight = parseInt($window.innerHeight - 170) +…
nitin
  • 3,747
  • 2
  • 24
  • 31
6
votes
3 answers

Angular Material : make a md-radio-group required

I am working with Angular Material, I need to make a radio group required, so that the user has to select a radio button, before he can submit the form. So the form should be invalid while no radio button is selected. this is the code
gaurav5430
  • 12,934
  • 6
  • 54
  • 111
6
votes
1 answer

Angular Material Nav Bar Set Default Active Item

I am experimenting with an angular app using Angular Material and cannot seem to get my navbar to set the default item to be selected. I am using the Angular Material Navbar (Directive Info) for displaying my views and here is my template html for…
user3786596
  • 117
  • 1
  • 2
  • 13
6
votes
3 answers
6
votes
3 answers

md dialog actions are on top instead of bottom of dialog

Followed the example on their website for a custom dialog and got a different outcome. My 'actions' row is at the top of the modal instead of the bottom as seen here Here's the html for the template I used
ceckenrode
  • 4,543
  • 7
  • 28
  • 48
6
votes
1 answer

What is the difference between Material Design Lite and Angular Material Design?

I am building a application using Angular 2 as front end. I want my application to be designed with Material Design. I want to know the different between the 2 material designs mentioned below. Will I have any issues in future if I follow anyone of…
Vinod
  • 31,933
  • 35
  • 96
  • 119
6
votes
1 answer

md-chips with md-select in multi select mode

When I am trying to generate md-chips on selecting multiple values from md-select, It is not working. Does md-chips works only with autocomplete analyser and input field?
Jagajit Prusty
  • 2,070
  • 2
  • 21
  • 39
6
votes
4 answers

Angular Material md-icon error No provider for Http

When using I get this error: ORIGINAL EXCEPTION: No provider for Http! So I added HTTP_PROVIDERS to my component and it solved it. So my question... Why do I need to add HTTP_PROVIDERS to my component to get to work even though…
jboothe
  • 1,043
  • 1
  • 11
  • 15
6
votes
3 answers

Angular Material - set color palette

I'm trying to setup an Angular project in combination with material design. A part of my package.json looks like this: "dependencies": { "@angular2-material/button": "2.0.0-alpha.3", "@angular2-material/card": "2.0.0-alpha.3", …
Vandeperre Maarten
  • 556
  • 1
  • 8
  • 21
6
votes
2 answers

How to disallow free text in md-autocomplete component of angular material?

How to disallow free text in md-autocomplete? I want the users to be only able to select from the list of items or add a ng-message based on some validation if the item is not selected from the list. Angular material md-autocomplete demo
Navneet
  • 4,543
  • 1
  • 19
  • 29
6
votes
1 answer

Angular Material md-input-container takes large space

I am working with a angular material sample. According to my default code md-input-container takes large space. My output as follows. But I have found md-input-content with less space as follows. I am not sure how to do that. My example of…
Channa Jayamuni
  • 1,876
  • 1
  • 18
  • 29
6
votes
3 answers

Flexbox causes adsense error: "adsbygoogle.push() error: No slot size for availableWidth=0"

I have a website which uses angular-material and flexbox for it's layouts. I'm trying to include a Google Adsense snippet inside one of these flexbox containers, but it gives me the error: "adsbygoogle.push() error: No slot size for…
Justin
  • 2,265
  • 4
  • 15
  • 21
6
votes
1 answer

Combining angular material with twitter bootstrap without conflicts

I would like to combine twitter bootstrap together with angular material. I found bootstrap material design https://github.com/FezVrasta/bootstrap-material-design Angular material uses following declarations;
6
votes
6 answers

Angular Material directive to hide element on small/mobile display

Is there an 'angular material way' to hide elements on small/mobile displays using a directive of some kind? Having used Angular and Angular Material for a while now, I thought this should be simple, but I'm just not finding it. I know about the…
John Rix
  • 6,271
  • 5
  • 40
  • 46
1 2 3
99
100