Ais-Current-Refinements | Angular InstantSearch V4 (Deprecated)

Signature

<ais-current-refinements
  // Optional parameters
  [includedAttributes]="string[]"
  [excludedAttributes]="string[]"
  [transformItems]="function"
></ais-current-refinements>

1
2
3
4
5
6
7
8
import { NgAisCurrentRefinementsModule } from 'angular-instantsearch';

@NgModule({
  imports: [
    NgAisCurrentRefinementsModule,
  ],
})
export class AppModule {}

1
2
3
4
5
6
7
8
import { NgAisModule } from 'angular-instantsearch';

@NgModule({
  imports: [
    NgAisModule.forRoot(),
  ],
})
export class AppModule {}

About this widget

The ais-current-refinements widget displays a list of refinementss applied to the search.

Examples

1
<ais-current-refinements></ais-current-refinements>

Props

includedAttributes

The attributes to include in the widget (all by default). Cannot be used with excludedAttributes. In the example below, only the categories attribute is included in the widget.

1
2
3
<ais-current-refinements
  [includedAttributes]="['categories']"
></ais-current-refinements>

excludedAttributes

The attributes to exclude from the widget. Cannot be used with includedAttributes. In the example below, the brand attribute is excluded from the widget.

1
2
3
<ais-current-refinements
  [excludedAttributes]="['brand']"
></ais-current-refinements>

transformItems

Receives the items and is called before displaying them. Should return a new array with the same shape as the original array. Useful for transforming, removing, or reordering items.

In addition, the full results data is available, which includes all regular response parameters, as well as parameters from the helper (for example disjunctiveFacetsRefinements).

1
2
3
<ais-current-refinements
  [transformItems]="transformItems"
></ais-current-refinements>

1
2
3
4
5
6
7
8
9
10
transformItems(items) {
  return items.filter(item => item.attribute !== 'brand');
},

/* or, combined with results */
transformItems(items, { results }) {
  return results.nbHits === 0
    ? items
    : items.filter(item => item.attribute !== 'brand');
},