Skip to main content

DetailComponentWithResolver

A helper function for creating tabs that point to a TypedBaseDetailComponent. This takes care of the route resolver parts so that the detail component automatically has access to the correct resolved detail data.

Example

Ts
@NgModule({  imports: [ReviewsSharedModule],  declarations: [/* ... *\/],  providers: [    registerPageTab({      location: 'product-detail',      tab: 'Specs',      route: 'specs',      component: detailComponentWithResolver({        component: ProductSpecDetailComponent,        query: GetProductSpecsDocument,        entityKey: 'spec',      }),    }),  ],})export class ProductSpecsUiExtensionModule {}
Signature
function detailComponentWithResolver<T extends TypedDocumentNode<any, { id: string }>, Field extends keyof ResultOf<T>, R extends Field>(config: {    component: Type<TypedBaseDetailComponent<T, Field>>;    query: T;    entityKey: R;    getBreadcrumbs?: (entity: ResultOf<T>[R]) => BreadcrumbValue;    variables?: T extends TypedDocumentNode<any, infer V> ? Omit<V, 'id'> : never;}): void

Parameters

config

parameter{ component: Type<TypedBaseDetailComponent<T, Field>>; query: T; entityKey: R; getBreadcrumbs?: (entity: ResultOf<T>[R]) => BreadcrumbValue; variables?: T extends TypedDocumentNode<any, infer V> ? Omit<V, 'id'> : never; }
Was this chapter helpful?
Report Issue
Edited Feb 2, 2026·Edit this page