angular-material2

问题 I'm using augular/material2 md-select. When I tab into the md-select component I can use the up and down arrows to select items. I can also press the space bar to see the list and use the up and down arrows and the enter key to select an item. What I can't do is press the first letter of an item and have that item selected. Using the example on https://material.angular.io/components/component/select I'd expect to be able to tab into the md-select component and press P to select Pizza. Is this

问题 This usually isnt a problem but just Material 2 is very under-documented atm so im having trouble making all images the same size but properly resize with window change All the images I have were pretty similar in size when I created then but one was abit longer height wise, but my old code just adjusted that with some bootstrap calls. But using the image in a mat-card it is a longer length and thus looks out of place shown here: The BAC calculator's image is longer than the rest so it looks

问题 In my Angular 2.0.0-rc.7 + Angular Material 2.0.0-alpha.8-1 application built with Angular CLI 1.0.0-beta.11-webpack.9-1 , I get the following error after upgrading from rc.5 + alpha.7-4 (via the 1.0.0-beta.11-webpack.8 NG CLI): main.bundle.js:44545 Error: No provider for Overlay! at NoProviderError.Error (native) at NoProviderError.BaseError [as constructor] (http://localhost:4200/main.bundle.js:7032:34) at NoProviderError.AbstractProviderError [as constructor] (http://localhost:4200/main

问题 I'm using an md-table in an Angular 4 app since I'm using Material for other parts of the UI formatting. When I use a regular table with basically no CSS, the columns auto-format to fit the widest td element. With md-table, the columns are all set to the same width divided into the total table width, except for cells that are too wide and then it extends the cell and pushes the other cells in that row to the right. My regular table: <md-tab label="Data" > <md-card class="datacard"> <md-card

问题 I'm getting following error when I'm trying to use Angular Material in the code. zone.js:101 GET http://localhost:3000/traceur 404 (Not Found)scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:345Zone.scheduleMacroTask @ zone.js:282(anonymous function) @ zone.js:122send @ VM437:3fetchTextFromURL @ system.src.js:1156(anonymous function) @ system.src.js:1739ZoneAwarePromise @ zone.js:607(anonymous function) @ system.src.js:1738(anonymous function) @ system.src.js:2764(anonymous

问题 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; box-sizing: border-box; display: block; margin: 24px; max-width: 568px; min-width: 288px; padding: 14px 24px; transform: translateY(100%) translateY(24px); } I have tried overriding using the same style in my style.css file but this style is overridden by the default style. .mat-snack-bar-container {

问题 I am trying to write a test on a component which uses angular-material2, but when I add it to my testModule declarations I get: Error: Template parse errors: 'md-card-title' is not a known element: 1. If 'md-card-title' is an Angular component, then verify that it is part of this module. 2. If 'md-card-title' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. Adding MaterialModule to the declarations throws `Error:

问题 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">{{question.question}}</mat-tab> </div> </mat-tab-group> which displays like: However I want to reduce tabs width, like this: The problem is, when I change css at run time, it adjusts fine, but when I put css like: .mat-tab { min-width: 50px !important; } .mat-tab-label[_ngcontent-c9]{ min-width: 50px !important; } It doesn't work.

问题 I would like to do that : <ng-template #content> <mat-step>step 1</mat-step> <mat-step>step 2</mat-step> </ng-template> <mat-horizontal-stepper> <ng-container *ngTemplateOutlet="content"></ng-container> </mat-horizontal-stepper> but i get this error ERROR Error: StaticInjectorError(AppModule)[MatStep -> MatStepper]: StaticInjectorError(Platform: core)[MatStep -> MatStepper]: NullInjectorError: No provider for MatStepper! I think this is because mat-step inject a mat-stepper in it's

问题 I am trying to use an Angular Material checkbox, and set it by default as checked, but it is displayed as non-checked, what is wrong? <mat-checkbox class = "example-margin" [(ngModel)] = obj.impresora> <label>Printer</label> </mat-checkbox> obj.impresora property is boolean 回答1: You can either set with ngModel either with [checked] attribute. ngModel binded property should be set to 'true': 1. <mat-checkbox class = "example-margin" [(ngModel)] = "myModel"> <label>Printer </label> </mat