purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-12-22 03:17:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Angular, Angular Material and Flex Layout to 6

Browse Source 
Updated additional project files
Updated Angular Material examples
This commit is contained in:
Sercan Yemen
2018-05-04 19:28:19 +03:00
parent 02df48ab4e
commit f4636d9a37
454 changed files with 13445 additions and 9629 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css Normal file → Executable file
View File

@@ -1,8 +1,8 @@
.example-container {
display: flex;
flex-direction: column;
display: flex;
flex-direction: column;
}
.example-container > * {
width: 100%;
width: 100%;
}

22
src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html Normal file → Executable file
View File

@@ -1,14 +1,14 @@
<form class="example-container" [formGroup]="options" [style.fontSize.px]="getFontSize()">
<mat-form-field [color]="options.value.color">
<mat-select placeholder="Color" formControlName="color">
<mat-option value="primary">Primary</mat-option>
<mat-option value="accent">Accent</mat-option>
<mat-option value="warn">Warn</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field [color]="options.value.color">
<mat-select placeholder="Color" formControlName="color">
<mat-option value="primary">Primary</mat-option>
<mat-option value="accent">Accent</mat-option>
<mat-option value="warn">Warn</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field [color]="options.value.color">
<input matInput type="number" placeholder="Font size (px)" formControlName="fontSize" min="10">
<mat-error *ngIf="options.get('fontSize')?.invalid">Min size: 10px</mat-error>
</mat-form-field>
<mat-form-field [color]="options.value.color">
<input matInput type="number" placeholder="Font size (px)" formControlName="fontSize" min="10">
<mat-error *ngIf="options.get('fontSize')?.invalid">Min size: 10px</mat-error>
</mat-form-field>
</form>

35
src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts Normal file → Executable file
View File

@@ -1,26 +1,23 @@
import { Component } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import {Component} from '@angular/core';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
/** @title Form field theming */
@Component({
selector : 'form-field-theming-example',
templateUrl: 'form-field-theming-example.html',
styleUrls : ['form-field-theming-example.css']
selector: 'form-field-theming-example',
templateUrl: 'form-field-theming-example.html',
styleUrls: ['form-field-theming-example.css']
})
export class FormFieldThemingExample
{
options: FormGroup;
export class FormFieldThemingExample {
options: FormGroup;
constructor(fb: FormBuilder)
{
this.options = fb.group({
'color' : 'primary',
'fontSize': [16, Validators.min(10)]
});
}
constructor(fb: FormBuilder) {
this.options = fb.group({
'color': 'primary',
'fontSize': [16, Validators.min(10)],
});
}
getFontSize()
{
return Math.max(10, this.options.value.fontSize);
}
getFontSize() {
return Math.max(10, this.options.value.fontSize);
}
}