select-entities.md

Select Entities

Reusable components for Ex Libris Cloud Apps to select one or multiple entities visible on the current Alma screen.

Configuration

After installing the component, add the following to app.module.ts:

import { SelectEntitiesModule } from 'eca-components';

...

@NgModule({
  imports: [
  ...
    SelectEntitiesModule,
  ],

Select Entities

The select entities component supports multiple selection. Features include:

• Display description of page entities
• Check/uncheck all
• Selection across multiple pages in Alma

Use the select entities component in your own component as follows.

Add an array to collect selected entities in your component.ts:

selectedEntities = new Array<Entity>();

In your component.html page, add a reference to the component and the array:

  <eca-select-entities
    [(selected)]="selectedEntities"
    >
  </eca-select-entities>

Select Entity

The select entity component supports selecting a single entity. Features include:

• Display description of page entities
• Radio buttons to select a single entity

Use the select entities component in your own component as follows.

Add an array to collect selected entities in your component.ts:

selectedEntity: Entity = null;

In your component.html page, add a reference to the component and the array:

<eca-select-entity
  [(selected)]="selectedEntity"
  >
</eca-select-entity>

Other methods

Both components also support the following properties/methods:

clear

Clears all selected items:

  @ViewChild(SelectEntitiesComponent) selectEntitiesComponent: SelectEntitiesComponent;

  clear() {
    this.selectEntitiesComponent.clear();
  }

count

Emits count of entities. Can be used to change user interface based on whether entities are displayed.

entityCount = 0;

<p *ngIf="entityCount == 0">Please navigate to a screen with entities.</p>
<eca-select-entities #selectEntities
  [(selected)]="selectedEntities"
  (count)="entityCount=$event"
  >
</eca-select-entities>

entityTypes

Filter the entity types to be displayed:

<eca-select-entities #selectEntities
  [(selected)]="selectedEntities"
  [entityTypes]="['BIB_MMS']"
  >
</eca-select-entities>

truncate

Truncate the entity list to one line each:

<eca-select-entities #selectEntities
  [(selected)]="selectedEntities"
  [truncate]="true"
  >
</eca>

From v1.4.1

lineNumbers

Add line numbers to the entity list:

<eca-select-entities #selectEntities
  [(selected)]="selectedEntities"
  [lineNumbers]="true"
  >
</eca>

From v1.4.2

entities$

Provide an observable of entities which overrides the entities displayed on the Alma screen.

In this example, we're retrieving all of the displayed and limiting to those created by the current user:

component.ts:

  entities$ = this.eventsService.entities$.pipe(
    tap(() => this.loading = true),
    mergeMap(entities => 
      combineLatest([
        of(entities),
        this.eventsService.getInitData(),
        forkJoin(entities.map(e => this.restService.call(e.link)))
          .pipe(defaultIfEmpty([]))
      ])
    ),
    map(([entities, initData, full]) => {
      const relevant = full.filter(f => f.created_by.value == initData.user.primaryId).map(f=>f.id);
      return entities.filter(e => relevant.includes(e.id));
    }),
    tap(() => this.loading = false)
  )

component.html:

<eca-select-entities #selectEntities
  [(selected)]="selectedEntities"
  [entityTypes]="['SET']"
  [entities$]="entities$"
  >
</eca-select-entities>