avatar-list

AvatarList

Avatar List is a simple material compoment displaing avatar images overlapped allowing a menu to select a specific avatar - provides data on selection.

Installation

npm install avatar-list

Scaffolding

Import the module into your project under imports AvatarsListModule

imports: [
    BrowserModule,
    AppRoutingModule,
    AvatarsListModule
  ],

Selector Usage

This is the basic selector

<app-avatars-list [data]="data" [select]="false" (selected)="onSelectedAvatar($event)"

Inputs

The following Inputs are available

Input	Type	Defaut	Description
data	AvatarDetails	avatar	this is an array of avatar objects
select	Boolean	false	provides a menu for specific avatar selection

AvatarDetails Model

Here is a sample of the AvatarDetail model information

{ id: 0, name: 'Name of Person', image: 'src.image.png', email: '[e-mail]' }

Outputs

Event	Type	Description
selected	AvatarDetails	Returns the AvatarDetails object