UI
Datum formatieren
(new Date()).toLocaleDateString("de-DE", { day: '2-digit', month: '2-digit', year: 'numeric' });
Quellen:
https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
Pipes mit Parametern
Möchte man ineinem Template einen Wert durch eine Pipe schicken und dabei Parameter mitgeben, werden diese ungewöhnlicherweise mit einem Doppelpunkt eingeleitet und getrennt:
{{status | round: 2[: 4]}}
In eckigen Klammern stehen mögliche weitere Paramter.
In der Pipe-Klasse werden diese Parameter in der transform() Methode dann als Array oder einzeln übergeben, je nach dem, wie die Methode deklariert ist:
transform(value: any, arg1?: any, arg2?: any)
oder
transform(value: any, args?: any[])
Eingabe
Validierungen
| component.ts |
template.html
|
import { AbstractControl, FormBuilder, FormGroup, ValidatorFn, Validators } from '@angular/forms';
class
{
angForm: FormGroup;
constructor(private formBuilder: FormBuilder)
{
this.angForm = formBuilder.group({
email: ['', Validators.required],
special: ['', this.customValidation("DE")]
})
}
customValidation(loc: string) : ValidatorFn
{
return (control: AbstractControl) =>
{
if (loc == "DE" && control.value == "Deutsch")
return null;
else
return { wrongCountry: true };
}
}
}
|
<input type="text" formControlName="email" [(ngModel)]="useremail"/>
<div *ngIf="angForm.controls['email'].invalid && (angForm.controls['email'].dirty || angForm.controls['email'].touched)">
<div *ngIf="angForm.controls['email'].errors.required">
Pflichtfeld!
</div>
</div>
<input type="text" formControlName="special" [(ngModel)]="custom"/>
<div *ngIf="angForm.controls['special'].invalid && (angForm.controls['special'].dirty || angForm.controls['special'].touched)">
<div *ngIf="angForm.controls['special'].errors.wrongCountry">
Falsches Land!
</div>
</div>
|