ngx-material-colorpicker

Color picker component (based on angular material 7+)

Usage

npm install --save @promact/ngx-material-colorpicker

Import

import { ColorpickerModule } from 'ngx-material-colorpicker';

// In your App's module:
imports: [
   ColorpickerModule
]

Add in your HTML

<ngx-material-colorpicker [(ngModel)]="color"></ngx-material-colorpicker>

API

Properties

| Name | Type | Description | | --- | --- | --- | | disabled | boolean | Whether or not the colorpicker is disabled | | format | string | Color format:'hex', 'rgb', 'hsl'.Default :hex | | id | number | The unique ID of this colorpicker. | | tabindex | number | The tabIndex of the colorpicker. |

Events

| Name | Type | Description | | --- | --- | --- | | change | Event | Fired when color is changed |

Examples

A colorpicker would have the following markup.

<ngx-material-colorpicker [(ngModel)]="color"></ngx-material-colorpicker>

<ngx-material-colorpicker [(ngModel)]="color" format="hsla"></ngx-material-colorpicker>

<ngx-material-colorpicker [(ngModel)]="color" [disabled]="true"></ngx-material-colorpicker>

Developing

Change code in projects/ngx-material-colorpicker/src folder

Build library

npm run build:lib

Run demo

ng serve