Pytania otagowane jako angular-material2

Próbuję użyć komponentu autouzupełniania Angular Material w moim projekcie Angular 2. Dodałem następujące do mojego szablonu. <md-input-container> <input mdInput placeholder="Category" [mdAutocomplete]="auto" [formControl]="stateCtrl"> </md-input-container> <md-autocomplete #auto="mdAutocomplete"> <md-option *ngFor="let state of filteredStates | async" [value]="state"> {{ state }} </md-option> </md-autocomplete> Oto mój komponent. import {Component, OnInit} from "@angular/core"; import {ActivatedRoute, Router} from …

354 angular  typescript  angular-material2  angular-forms 

W naszej firmie staramy się budować własne komponenty form-field. Próbujemy owinąć komponenty Material Design w ten sposób: pole: <mat-form-field> <ng-content></ng-content> <mat-hint align="start"><strong>{{hint}}</strong> </mat-hint> <mat-hint align="end">{{message.value.length}} / 256</mat-hint> <mat-error>This field is required</mat-error> </mat-form-field> pole tekstowe: <field hint="hint"> <input matInput [placeholder]="placeholder" [value]="value" (change)="onChange($event)" (keydown)="onKeydown($event)" (keyup)="onKeyup($event)" (keypress)="onKeypress($event)"> </field> Stosowanie: <textbox value="test" hint="my hint"></textbox> …

187 angular  angular-material2 

Do dodania używam materiału 2 md-raised-button. Chcę stosować tę dyrektywę tylko wtedy, gdy spełnią się określone warunki. Na przykład: <button md-raised-button="true"></button> Inny przykład: stworzyłem podstawową dynamiczną formę reaktywną w plunkerze. Używam formArrayNamedyrektywy formy reaktywnej dla tablicy kontrolek. Chcę zastosować formArrayNamedyrektywę tylko wtedy, gdy określony warunek stanie się prawdziwy, w przeciwnym …

112 angular  angular-material  angular2-forms  angular2-directives  angular-material2 

W wielu miejscach w źródle materiałów kątowych istnieją elementy / klasy css, które mają cdkprzedrostek. Czy ktoś wie, jaki jest skrót cdkw kontekście materiału kątowego?

109 angular-material2  angular-cdk 

Mam mat-select, w którym opcje są wszystkimi obiektami zdefiniowanymi w tablicy. Próbuję ustawić wartość domyślną na jedną z opcji, jednak pozostaje ona zaznaczona podczas renderowania strony. Mój plik maszynopisu zawiera: public options2 = [ {"id": 1, "name": "a"}, {"id": 2, "name": "b"} ] public selected2 = this.options2[1].id; Mój plik HTML …

109 angular  typescript  angular-material2 

Chcę używać kolorów marki mojej firmy w całej aplikacji. Znalazłem ten problem: AngularJS 2 - Material design - ustaw paletę kolorów, w której mogę zbudować rzekomo niestandardowy motyw, ale w zasadzie jest to po prostu użycie różnych części gotowych palet. Nie chcę używać predefiniowanych kolorów Material2. Chcę mieć niepowtarzalne i …

105 angular  sass  material-design  angular-material2 

Zainstalowałem Materiał na kątowe, Zaimportowałem do mojej aplikacji moduł MatIconModule (z import { MatIconModule } from '@angular/material/icon';) Dodałem go do mojego importu ngmodule z: @NgModule({ imports: [ //... MatIconModule, //... Zaimportowałem wszystkie arkusze stylów Zaimportowałem go również do komponentu aplikacji, który faktycznie (próbuje) ich używać (z inną import {MatIconModule} from …

93 angular  angular-material  angular-material2 

Mam pytanie dotyczące Angular Material (z Angular 4+). Powiedz w moim szablonie komponentów, że dodaję <mat-horizontal-stepper>komponent, a na każdym kroku <mat-step>mam przyciski krokowe do nawigacji po komponencie. Tak jak tak ... <mat-horizontal-stepper> <mat-step> Step 1 <button mat-button matStepperPrevious type="button">Back</button> <button mat-button matStepperNext type="button">Next</button> </mat-step> <mat-step> Step 2 <button mat-button matStepperPrevious …

85 angular  angular-material  angular-material2 

Mam normalną tabelę danych Angular Material 2 DataTable z nagłówkami sortowania. Wszystkie rodzaje nagłówków działają dobrze. Z wyjątkiem tego, który ma obiekt jako wartość. Te w ogóle się nie sortują. Na przykład: <!-- Project Column - This should sort!--> <ng-container matColumnDef="project.name"> <mat-header-cell *matHeaderCellDef mat-sort-header> Project Name </mat-header-cell> <mat-cell *matCellDef="let element"> …

83 angular  angular-material2