md2-colorpicker v0.0.1-alpha.0

md2-colorpicker

Native Angular2 Material Colorpicker directive

API

Example:

//HTML

<md2-colorpicker [(ngModel)]="color" 
               position="bottom" 
               (change)="change($event)">
</md2-colorpicker>

//app-module.ts

import {Md2ColorpickerModule} from 'md2-colorpicker/colorpicker';

@NgModule({
 imports: [
   Md2ColorpickerModule,
 ],
 declarations: [
   ...
 ]  
})

//component.ts
...

@Component({
 selector: "...",
 templateUrl: 'component.html'
})

export class ... {
   
   ...
   
   private color: string = "#123456";

   private change(value) { 
     ...
   }

   ...

}

Properties

• [(ngModel)] - string - (Default: #000)- Two way data binding - It would be 'value' of color.
• [position] - string - (Default: bottom)(Optional) - position of colorpicker dialog, supported positions: 'right', 'left', 'top', 'bottom'.
• [format] - string - (Default: hex)(Optional) - color format, supported formats: 'hex', 'rgba', 'hsla'.