angular-material2 Questions

6

Solved

I wanted to change Angular Material Radio button default color. I can only able to change to radio button color. <mat-radio-group> <mat-radio-button value="1">Option 1</mat-radio-...

4

im having this issue which is breaking my head right now and I cant figured out what is the problem. I have a form called device-form, which is called from the dashboard using routing. The device f...
Rubicund asked 27/2, 2018 at 15:33

7

Solved

I am creating a custom directive called TooltipDirective whihc is going to add matTooltip to every host element, code is like below import { Directive, ElementRef, Input, OnInit, Renderer } from '...
Sadyesaechao asked 10/7, 2018 at 18:35

7

I have a mat-select with options, I am looking to set this inline to text and have the drop down only be as long as the longest option. I can probably do some hackery with js / css vanilla style, b...
Furman asked 4/2, 2019 at 14:16

10

Solved

I have an angular expansion panel as shown below. How can i change the color of the arrow below to white? My code (HTML): <md-expansion-panel> <md-expansion-panel-header> <md-pa...
Tetartohedral asked 3/10, 2017 at 8:16

5

Solved

i am using angular material 6 ,i have a vaidation inside mat-form-field mat-error is not displayed , when move after mat-form-field to the mat-error which is displaying properly. Not Working code:...
Orthoepy asked 21/7, 2018 at 13:19

9

In Angular 6, I am using Angular Material to display some data using Tabs. <mat-tab-group> <mat-tab *ngFor="let bar of foo.bar" [label]="bar.Name" [ngClass]="bar.IsActive ? 'bar-on'...
English asked 11/7, 2018 at 7:53

6

Solved

In Angular 1 Material I could use a directive, right now it is an attribute, right now it is very hard to do. How can I do it simply to only show the tooltip like when the width of page is small an...
Kaela asked 26/2, 2017 at 15:14

7

Solved

In an Angular 4 (Material) app, I have a text field for search. When I type in the field, a second field appears showing the entered text. This new field floats as I scroll the page. How do I disab...
Leningrad asked 26/9, 2017 at 5:43

7

Solved

I have been working on a web app for the past few weeks and we wanted to make some updates. We updated the project and all of its node modules and when I got everything working again the select dro...
Jerrylee asked 25/10, 2018 at 11:45

6

Solved

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 ...
Sugihara asked 14/1, 2017 at 17:59

21

Solved

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 shou...
Proportioned asked 26/3, 2019 at 16:3

6

Is it possible to change the inkbar color of the active tab? By default the ink bar is blue. See here for an example. I tried this in SCSS, but it doesn't work. .mat-tab-label-container{ .mat-t...
Neckline asked 12/2, 2018 at 5:24

5

Solved

We are developing a corporate component library which should provide Material Designed Angular Components. So the users of this library are not supposed to use e.g. Angular Material directly but ra...

5

When tab inside tab then if selected index of sub tab is 1 then it should show as selected. Let parent tab has two tabs, it has selectedIndex is 0, and sub tab inside parent tab1 has selectedIndex...
Extrinsic asked 23/12, 2017 at 8:20

7

Solved

I have the following piece of code <mat-tab-group> <div *ngFor="let question of subcategory.questions"> <mat-tab label={{question.question_id}} class="question-tab">{{questio...
Noise asked 6/6, 2017 at 9:55

4

Solved

I am using angular 4 with angular materials to construct a table. I want the mat-sort-header to be added conditionally on the following template. <mat-header-cell *matHeaderCellDef mat-sort-he...
Carillonneur asked 15/2, 2018 at 7:54

6

Solved

I want to remove the bottom border of the tabs group which in the image below is gray. Here is a sample project to show of the code: https://stackblitz.com/edit/angular-tabs-remove-bottom-bord...
Shriner asked 16/7, 2019 at 9:41

12

Solved

I am attempting to override the default max-width of the snackbar component in Angular Material. The CSS applied by Angular Material is shown below: .mat-snack-bar-container { border-radius: 2px...
Whoreson asked 12/12, 2017 at 0:52

4

I need to keep tree nodes open/closed stated when i set new data to this.dataSource.data. New data is very same with old - it just have one or several lowest-level nodes added/removed. My idea is...
Lulita asked 13/11, 2018 at 11:30

3

Solved

TL,DR; How can a scroll strategy be used when creating a CdkConnectedOverlay declaratively? Detail; CdkConnectedOverlay is a Directive to facilitate declarative creation of an Overlay. It provide...
Sievert asked 11/4, 2018 at 20:49

10

Solved

I created an Angular project using the CLI. I'm using SCSS, and I included Angular Material with a custom theme iirc. I added a couple dummy components, and the app still built fine. Then I needed ...
Sexennial asked 22/5, 2021 at 16:50

7

Solved

I have scenario as below: I want to achieve is: When user click on All then all options shall be selected and when user click All again then all options shall be deselcted. If All option is ch...
Latish asked 29/7, 2018 at 11:55

8

Solved

I've created a form in a dialog using material forms, but I can't seem to get the inputs to be wider than 180px despite following numerous examples including https://material.angular.io/components/...
Outroar asked 22/1, 2018 at 7:31

9

Solved

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 dialog...

© 2022 - 2025 — McMap. All rights reserved.