diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts index 1805d87233..23fc4290af 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts @@ -15,11 +15,10 @@ import { inject, Injector, Input, - OnChanges, - Optional, + OnChanges, Optional, SimpleChanges, SkipSelf, - ViewChild, + ViewChild } from '@angular/core'; import { ControlContainer, @@ -94,6 +93,7 @@ export class ExtensibleFormPropComponent implements OnChanges, AfterViewInit { @Input() data!: PropData; @Input() prop!: FormProp; @Input() first?: boolean; + @Input() isFirstGroup?: boolean; @ViewChild('field') private fieldRef!: ElementRef; injectorForCustomComponent?: Injector; @@ -124,10 +124,10 @@ export class ExtensibleFormPropComponent implements OnChanges, AfterViewInit { search = (text$: Observable) => text$ ? text$.pipe( - debounceTime(300), - distinctUntilChanged(), - switchMap(text => this.prop?.options?.(this.data, text) || of([])), - ) + debounceTime(300), + distinctUntilChanged(), + switchMap(text => this.prop?.options?.(this.data, text) || of([])), + ) : of([]); typeaheadFormatter = (option: ABP.Option) => option.key; @@ -154,9 +154,8 @@ export class ExtensibleFormPropComponent implements OnChanges, AfterViewInit { } ngAfterViewInit() { - if (this.first && this.fieldRef) { + if (this.isFirstGroup && this.first && this.fieldRef) { this.fieldRef.nativeElement.focus(); - this.cdRef.detectChanges(); } } diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.html b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.html index 4b47e8fbb1..b88c2ecbfa 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.html +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.html @@ -1,5 +1,5 @@ @if (form) { - @for (groupedProp of groupedPropList.items; track i; let i = $index) { + @for (groupedProp of groupedPropList.items; track i; let i = $index; let first = $first) { @if (isAnyGroupMemberVisible(i, data) && groupedProp.group?.className) {
} @else { } @@ -23,8 +23,8 @@ } } - - @for (prop of groupedProp.formPropList; let first = $first; track prop.name) { + + @for (prop of groupedProp.formPropList; let index = $index; let first = $first; track prop.name) { @if (prop.visible(data)) { @if (extraProperties.controls[prop.name]) { @@ -37,6 +37,7 @@ [prop]="prop" [data]="data" [first]="first" + [isFirstGroup]="isFirstGroup" /> } }