@bepo65/mat-tristate-checkbox

@bepo65/mat-tristate-checkbox

<mat-tristate-checkbox> provides the same functionality as the Angular Material checkbox enhanced with 3 states.

Prerequisites

The package can be used in Angular apps with Angular Material installed. This Version requires Angular 15.

Installation of checkbox

npm install @bepo65/mat-tristate-checkbox

Sample usage of checkbox

Now you can use the mat-tristate-checkbox component in your app components, for example in app.component.ts:

import { MatTristateCheckboxModule } from '@bepo65/mat-tristate-checkbox';
...
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    ...
    MatTristateCheckboxModule
  ],
  ...
})
export class AppModule { }

And in template file app.component.html:

<form [formGroup]="form">
  <mat-tristate-checkbox formControlName="keepMeLoggedIn">remember me</mat-tristate-checkbox>
</form>

Demo project

Try out the demo page.

Properties of checkbox

Name	Description
@Input() color: ThemePalette	Theme color palette for the component. Defaults to 'accent'
@Input() disabled: any	Whether the checkbox is disabled.
@Input() labelPosition: 'before' | 'after'	Whether the label should appear after or before the checkbox. Defaults to 'after'

Values of checkbox

The value aof the checkbox cycle through these values:

undefined > false > true

Changelog

For list of changes and bugfixes, see CHANGELOG.md.

Author

Bernhard Pottler

on Github: @BePo65

License

Copyright © 2020 Bernhard Pottler.

This project and its packages are released under MIT license.