Skip to main content

BaseDetailComponent

BaseDetailComponent​

@vendure/admin-uibase-detail.component.ts

A base class for entity detail views. It should be used in conjunction with the BaseEntityResolver.

Example

@Component({
  selector: 'app-my-entity',
  templateUrl: './my-entity.component.html',
  styleUrls: ['./my-entity.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class GlobalSettingsComponent extends BaseDetailComponent<MyEntityFragment> implements OnInit {
  detailForm: FormGroup;

  constructor(
    router: Router,
    route: ActivatedRoute,
    serverConfigService: ServerConfigService,
    protected dataService: DataService,
    private formBuilder: FormBuilder,
  ) {
    super(route, router, serverConfigService, dataService);
    this.detailForm = this.formBuilder.group({
      name: [''],
    });
  }

  protected setFormValues(entity: MyEntityFragment, languageCode: LanguageCode): void {
    this.detailForm.patchValue({
      name: entity.name,
    });
  }
}
Signature
class BaseDetailComponent<Entity extends { id: string; updatedAt?: string }> implements DeactivateAware {
    entity$: Observable<Entity>;
    availableLanguages$: Observable<LanguageCode[]>;
    languageCode$: Observable<LanguageCode>;
    languageCode: LanguageCode;
    isNew$: Observable<boolean>;
    id: string;
    abstract detailForm: UntypedFormGroup;
    protected destroy$ = new Subject<void>();
    constructor(route: ActivatedRoute, router: Router, serverConfigService: ServerConfigService, dataService: DataService, permissionsService: PermissionsService)
    init() => ;
    setUpStreams() => ;
    destroy() => ;
    setLanguage(code: LanguageCode) => ;
    canDeactivate() => boolean;
    setFormValues(entity: Entity, languageCode: LanguageCode) => void;
    setCustomFieldFormValues(customFields: CustomFieldConfig[], formGroup: AbstractControl | null, entity: T, currentTranslation?: TranslationOf<T>) => ;
    getCustomFieldConfig(key: Exclude<keyof CustomFields, '__typename'>) => CustomFieldConfig[];
    setQueryParam(key: string, value: any) => ;
}
  • Implements: DeactivateAware

entity$​

property
Observable<Entity>

availableLanguages$​

property
Observable<LanguageCode[]>

languageCode$​

property
Observable<LanguageCode>

languageCode​

property
LanguageCode

isNew$​

property
Observable<boolean>

id​

property
string

detailForm​

property
UntypedFormGroup

destroy$​

property

constructor​

method
(route: ActivatedRoute, router: Router, serverConfigService: ServerConfigService, dataService: DataService, permissionsService: PermissionsService) => BaseDetailComponent

init​

method
() =>

setUpStreams​

method
() =>

destroy​

method
() =>

setLanguage​

method
(code: LanguageCode) =>

canDeactivate​

method
() => boolean

setFormValues​

method
(entity: Entity, languageCode: LanguageCode) => void

setCustomFieldFormValues​

method
(customFields: CustomFieldConfig[], formGroup: AbstractControl | null, entity: T, currentTranslation?: TranslationOf<T>) =>

getCustomFieldConfig​

method
(key: Exclude<keyof CustomFields, '__typename'>) => CustomFieldConfig[]

setQueryParam​

method
(key: string, value: any) =>