Questions tagged angular-material

Explore the latest questions and answers asked by our top developers.

how to add space bettween elements in flex box

I need to display a list of scheduled jobs in an endless scroll list of angular material, for each element in the list, I need to divide it into 3 columns using flexbox. in each column, I want to display certain data. for some reason, I’m not able to add space between columns inside the […]

How to bind mat autocomplete with ng form?

I work on angular 11 I face issue I can’t bind auto complete angular material with ng form for insert data insertRecord(form: NgForm) { } on html component <form #form="ngForm" (submit)="onSubmit(form)" autocomplete="off"> <mat-form-field > <input type="text" placeholder="Select Item" aria-label="Number" matInput [matAutocomplete]="auto" [formControl]="myControl" class="form-control"> <mat-autocomplete #auto="matAutocomplete" > <mat-option (click)="getselected(exp.itemName,i,exp.id)" *ngFor="let exp of this.filteredOptions | async;let i […]

How to extract query parameters using switchMap

In Angular component, in .ts I want to extract query parameters and pas these params to store action. this.route.queryParams .pipe( switchMap(() => this.store.select(selectSelectedLoan)), tap((selectedLoan) => this.store.dispatch(AccountActions.addNewPaymentMethod({ borrowerId: selectedLoan.borrowerId, accountNumber: selectedLoan.accountNumber, tokenId: this.tokenId, fundingAccount: this.fundingAccount, nickName: this.nickName, singleUse: this.singleUse, expiryDate: this.expiryDate, fundingAccountSubType: this.fundingAccountSubType, ssoKey: this.ssoKey }))), tap((status) => this.router.navigate([‘./account/payments’])), takeUntil(this.unsubscriber$) ) .subscribe(); Currently I have defined […]

By user14463446
Published
Categorized as angular, angular-material Tagged ,

Angular CDK Drag’n’zone doesnt respect scrolling containers, dead drop zones

I have a problem with Angular’s Drag’n’drop, DropZone to be exact. TL;DR DropZone in Angular CDK Drag’n’Drop works out-of-box only for non-scroll containers. If it has a scroll you have to use cdkScrollable, but this makes the column move in 4 directions. This excludes its use on sticky headers – an attempt to use drag’n’drop […]

Angular Expansion Panel and Body with Flex Layout not Aligning

In Angular, I have a table of mat accordion expansion panels, where each individual expansion panel uses flex layout. Right now, the header and body of the expansion panel are not aligned properly. The header has four elements with the following fxFlex: 33%, 16%, 16%, 35% The body has two elements with the following fxFlex: […]

mat-checkbox check on method result

I have a mat-checkbox, and when I click it I show a mat-dialog component, and if the user clicks "confirm" I want the checkbox to become checked, if they press cancel, I want it to remain unchecked, how do I do this? Here is the method that the checkbox calls when clicked: onShowDialog(): void { […]

Angular 12 Update has made my fonts look different

My application was previously on Angular 10. I upgraded to Angular 11 with no issues–then immediately went to Angular 12 afterwards. Everything compiles fine and the app works fine. The only issues I have ran into are my fonts are now different. By different–I mean that the Google Web Font I am using "Open Sans"–is […]

auto complete angular component display selected text as Id issue?

I work on angular 11 i face issue selected text from auto complete display as Value id example I select tea then tea must display on auto complete but this not happen what happen is item id display on autocomplete input so How to solve this issue <div class="form-group col-md-6"> <label>item</label> <div class="col-sm-3 form-group" > […]

Have to change the default dateformat in datepicker without using Moment npm (Angular)

Need to Change the Default Dateformat in the datepicker I can’t use the NPM (Angular) Needed Formats, Dd mm YYYY, Mm dd yyyy, LL & L Source: Angular Material Quesions

How to make Angular Material Select to consider the width of the placeholder?

Here is an example of a <mat-select> https://stackblitz.com/edit/angular-vy3buj?file=src%2Fstyles.scss It seems the control has a hardcoded width of 180px set in the CSS class .mat-form-field-infix, I want a dynamic width based on the width of the placeholder text (i.e. at least to show the whole placeholder text). But as you can see from the example, if […]

By user1589188
Published
Categorized as angular, angular-material, css, html Tagged , , ,
1 2 3 603

Still Have Questions?


Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us
faq