angular-material2

问题 I have a hybrid Angular1 and Angular2 application. In one of the Angular2 components that I route to, I want to use a Material Design Button. When I insert a button into the template like this <md-button>foo</md-button> the application starts crashing with this console message Error: Template parse errors: 'md-button' is not a known element: 1. If 'md-button' is an Angular component, then verify that it is part of this module. 2. If 'md-button' is a Web Component then add "CUSTOM_ELEMENTS

问题 I would like to use the new Portal from material CDK to inject dynamic content in multiple part of a form. I have a complex form structure and the goal is to have a form that specify multiple place where sub components could (or not) inject templates. Maybe the CDK Portal is not the best solution for this? I tried something but I am sure it is not the way of doing: https://stackblitz.com/edit/angular-yuz1kg I tried also with new ComponentPortal(MyPortalComponent) but how can we set Inputs on

问题 Can anyone provide an example of how to dynamically load a component into a Material MatDialog? What I would like to do is this: I will provide the MatDialog configuration data with a component Type which the dialog would then create an instance of and place inside it's mat-dialog-content area. It appears I would need to use some combination of ng-template and viewContainerRef, but I do not know how to instantiate the provided component Type and insert into the desired area. A simple example:

问题 I want to use mat-errors to render server-side errors in my Angular 5 SPA. This is what I've got so far, and it works <mat-form-field class="col-6"> <input matInput formControlName="firstName"> <mat-error [hidden]="!form.controls.firstName.hasError('required')">This field is required and cannot be empty</mat-error> <mat-error [hidden]="!form.controls.firstName.hasError('other')">Some other error</mat-error> </mat-form-field> Every field of the form looks similar. Input field and many mat

问题 Error below arose after upgrading from @angular/material 2.0.0-beta.11 to 2.0.0-beta.12 : Module @angular/material/material has no exported member 'MdButtonModule'. Typescript-code: import { MdButtonModule } from '@angular/material'; What happened? ERROR in c:/dev/my-proj/src/app/app-material/app-material.module.ts (4,3): Module '"c:/dev/my-proj/node_modules/@angular/material/material"' has no exported member 'MdButtonModule'. ERROR in c:/dev/my-proj/src/app/app-material/app-material.module

问题 I wish it was just plug and play :-) I've been thrashing around with this for hours with none of my little experiments working. The md data table is new, so there is almost no divine knowledge on the Web yet. Finding a good way to connect Firebase to the table would be a good start. Any ideas? Currently I have this setup. My code works great without the table with the standard Angular setup and code, using ngFor and creating a list from a template. So the code delivers the data from Firebase

问题 I'm using angular material in my project and I'm using Mat-Table to render 1000 Product/row per table. When Change pagination (we use backend pagination) of table to 1000 rows the performance become very slow I even can't write in textboxes. I tried to debug the issue so I put logs on one column template so I can see how's render works. I see it's Rerender all rows even if I hover on the table headers. Is there's any possibilities to control the change detection to be like

问题 In the official theming documentation of Angular Material2 it states clearly the following: In Angular Material, a theme is created by composing multiple palettes. In particular, a theme consists of: A primary palette: colors most widely used across all screens and components. An accent palette: colors used for the floating action button and interactive elements. A warn palette: colors used to convey error state. A foreground palette: colors for text and icons. A background palette: colors

问题 I am building an angular2 app using angular material2. I am trying to set the background of my application "the correct way", but I can't figure out how. I found a class I can use on my <body> element: mat-app-background which I can add, that gives me a default color (depending on whether I'm using the light or dark themes). I wish to define this background color to use my brands' color, but I cannot figure out how to do it. In _theming.scss it is defined like so: // Mixin that renders all of

问题 I am using Angular 4 and Angular Material 2. For the following code : <form> <md-form-field> <input mdInput [ngModel]="userName" placeholder="User" [formControl]="usernameFormControl"> <md-error *ngIf="usernameFormControl.hasError('required')"> This is <strong>required</strong> </md-error> <input mdInput [ngModel]="password" placeholder="Password" [formControl]="passwordFormControl"> <md-error *ngIf="passwordFormControl.hasError('required')"> This is <strong>required</strong> </md-error>