angular-material2

问题 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-header>Id</mat-header-cell> I have tried the following code: <mat-header-cell *matHeaderCellDef [mat-sort-header]=" column!='id' ? column : false ">Id</mat-header-cell> But it still adds the sorting header in the table for this column. My overall table looks as follows, and is working fine, except for the

问题 I have a dropdown with user names. I would like to order it alphabetically. How can I achieve this? <md-select formControlName="user" id="user" style="min-width: 200px;"> <md-option *ngFor="let user of users" [value]="user.id"> {{user.displayName}} </md-option> </md-select> 回答1: you can build a custom OrderBy Pipe for this. For example the below OrderBy Pipe will sort the object array by the key you passed to it with alphabetically or value based (order: asc ): @Pipe({name: 'OrderBy'}) export

问题 So I'm using Angular Material 2 to build my website and when I try to open a Dialog it opens at the end of the page and not in the centre of the page as it should do, somewhat like it doesn't respect the overlay rules. My AppComponent, where i declare my dialog components, looks like this: import { Component, OnInit } from '@angular/core'; import { Title } from '@angular/platform-browser'; import { MdDialog, MdDialogRef, MdDialogConfig } from '@angular/material'; import { StaffService } from

问题 I wasted a lot of time on this mistake, I'm starting new angular5 project and I want to use angular material. I imported and exported the material modules in a material.module.ts file: import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { CommonModule } from '@angular/common'; import { MatIconModule,MatButtonModule,MatSidenavModule,MatToolbarModule } from '@angular/material'; @NgModule({ imports: [ BrowserModule, CommonModule,

问题 I imported a date picker in a project and was wondering if there was any official recent component from angular and material to include time in the calendar as well. I've seen plenty of time pickers in material documentation and researched a lot of third party ones, but they seem very complex. 回答1: Unfortunately, the answer to your question of whether there is official Material support for selecting the time is "No", but it's currently an open issue on the official Material2 GitHub repo:

问题 I have added 2 tables in stackblitz link, if I hover in first table(1st column) alst rows the tooltip opens above( expected ) but when we scroll down the page and then hover on the last rows of 2nd table, the tooltip gets hidden in the bottom of the screen, as was not the case if I have a single table. I was expecting the tooltip to be opened above instead of getting hidden in the bottom. Please suggest. Stacblitz link https://stackblitz.com/edit/angular-mat-tooltip-ctvigc?file=app%2Ftooltip

问题 I dynamically loop thru tabs and i would like to add a (click) event on to be able to load different options when i select tab. Isn't it possible to have an event (click) event on ? I tried with (selectChange) on but then i cannot get hold of bank.id from my loop when creating tabs. Isn't it possible to add simple click event on dynamically created tabs?? <mat-tab-group> <mat-tab label="All transactions"> <mat-list> <mat-list-item *ngFor="let bank of banks"> <h4 mat-line>{{bank.fullName}}</h4

问题 I dynamically loop thru tabs and i would like to add a (click) event on to be able to load different options when i select tab. Isn't it possible to have an event (click) event on ? I tried with (selectChange) on but then i cannot get hold of bank.id from my loop when creating tabs. Isn't it possible to add simple click event on dynamically created tabs?? <mat-tab-group> <mat-tab label="All transactions"> <mat-list> <mat-list-item *ngFor="let bank of banks"> <h4 mat-line>{{bank.fullName}}</h4

问题 This is the format of date I am getting when I am using angular material datepicker.... Wed Nov 21 2018 00:00:00 GMT+0530 (India Standard Time) But I need date in (YYYY-MM-DD) or (YYYY-MM-DDTHH:mm) this format. this is model class I am using to capture data from angular material form export class FlightSchedule { constructor( public destination: string, public origin: string, public date: string, public limit: string ) {} } Please help me, I am unable to convert date in YYYY-MM-DD or YYYY-MM

问题 This is the format of date I am getting when I am using angular material datepicker.... Wed Nov 21 2018 00:00:00 GMT+0530 (India Standard Time) But I need date in (YYYY-MM-DD) or (YYYY-MM-DDTHH:mm) this format. this is model class I am using to capture data from angular material form export class FlightSchedule { constructor( public destination: string, public origin: string, public date: string, public limit: string ) {} } Please help me, I am unable to convert date in YYYY-MM-DD or YYYY-MM