Chore: Moved from Untyped to Stongly Typed forms.

This commit is contained in:
2022-07-15 13:24:25 +05:30
parent facf2df91e
commit 28f9bf2180
78 changed files with 1091 additions and 1004 deletions

View File

@ -1,12 +1,12 @@
import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { UntypedFormBuilder, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { FormControl, FormGroup } from '@angular/forms';
import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { ActivatedRoute, Router } from '@angular/router';
import * as moment from 'moment';
import { Observable, of as observableOf } from 'rxjs';
import { debounceTime, distinctUntilChanged, map, startWith, switchMap } from 'rxjs/operators';
import { debounceTime, distinctUntilChanged, map, switchMap } from 'rxjs/operators';
import { Account } from '../core/account';
import { AccountService } from '../core/account.service';
@ -27,7 +27,12 @@ export class LedgerComponent implements OnInit, AfterViewInit {
@ViewChild(MatSort, { static: true }) sort?: MatSort;
info: Ledger = new Ledger();
dataSource: LedgerDataSource = new LedgerDataSource(this.info.body);
form: UntypedFormGroup;
form: FormGroup<{
startDate: FormControl<Date>;
finishDate: FormControl<Date>;
account: FormControl<Account | string | null>;
}>;
selectedRowId = '';
debit = 0;
credit = 0;
@ -40,19 +45,18 @@ export class LedgerComponent implements OnInit, AfterViewInit {
constructor(
private route: ActivatedRoute,
private router: Router,
private fb: UntypedFormBuilder,
private toCsv: ToCsvService,
private ser: LedgerService,
private accountSer: AccountService,
) {
this.form = this.fb.group({
startDate: '',
finishDate: '',
account: '',
this.form = new FormGroup({
startDate: new FormControl(new Date(), { nonNullable: true }),
finishDate: new FormControl(new Date(), { nonNullable: true }),
account: new FormControl<Account | string | null>(null),
});
this.accounts = (this.form.get('account') as UntypedFormControl).valueChanges.pipe(
startWith(null),
this.accounts = this.form.controls.account.valueChanges.pipe(
map((x) => (x instanceof Account ? x.name : x)),
map((x) => (x !== null && x.length >= 1 ? x : null)),
debounceTime(150),
distinctUntilChanged(),
@ -127,7 +131,7 @@ export class LedgerComponent implements OnInit, AfterViewInit {
const formModel = this.form.value;
return new Ledger({
account: formModel.account,
account: formModel.account as Account,
startDate: moment(formModel.startDate).format('DD-MMM-YYYY'),
finishDate: moment(formModel.finishDate).format('DD-MMM-YYYY'),
});