
Security News
Meet Socket at Black Hat and DEF CON 2025 in Las Vegas
Meet Socket at Black Hat & DEF CON 2025 for 1:1s, insider security talks at Allegiant Stadium, and a private dinner with top minds in software supply chain security.
github.com/AndyMeps/ng2-color-picker
Simple color picker for Angular 2
The module relies on ngx-bootstrap
for dropdown functionality.
To include in your project install via NPM with:
npm install --save ng2-color-picker
You will then need to include the module to your app.module.ts:
import { ColorPickerModule } from 'ng2-color-picker';
// ...
@NgModule({
imports: [
ColorPickerModule
]
})
///...
Finally, include the component in your HTML as per the next section.
Once the module is installed, you will need to add HTML markup to include the picker in a component.
The minimum requirement is an [(ngModel)]
attribute, which should provide a string representation of a color, and an [availableColors]
attribute, which should provide a string[]
of available colors.
<color-picker
[(ngModel)]="color"
[availableColors]="availableColors">
</color-picker>
It is possible to configure ng2-color-picker
by providing a configuration object to the [pickerConfig]
attribute (see the next section for more details on this object):
<color-picker
[(ngModel)]="color"
[availableColors]="availableColors"
[pickerConfig]="pickerOptions">
</color-picker>
ng2-color-picker
exposes an interface to provide an indication of valid configuration properties, this can be referenced as a type for your configuration object by importing it:
import { IColorPickerConfiguration } from 'ng2-color-picker';
Which can then be used as the configuration object type in your component:
public pickerOptions: IColorPickerConfiguration;
Current list of configuration options, types and default values:
Property | Type | Default | Description. |
---|---|---|---|
width | number | 25 | Width of the picker control. |
height | number | 25 | Height of the picker control. |
borderRadius | number | 4 | Radius of the picker control border. |
FAQs
Unknown package
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Meet Socket at Black Hat & DEF CON 2025 for 1:1s, insider security talks at Allegiant Stadium, and a private dinner with top minds in software supply chain security.
Security News
CAI is a new open source AI framework that automates penetration testing tasks like scanning and exploitation up to 3,600× faster than humans.
Security News
Deno 2.4 brings back bundling, improves dependency updates and telemetry, and makes the runtime more practical for real-world JavaScript projects.