Checkbox

import { ChangeDetectionStrategy, Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
 
import { ZardCheckboxComponent } from '../checkbox.component';
 
@Component({
  selector: 'z-demo-checkbox-default',
  imports: [ZardCheckboxComponent, FormsModule],
  template: `
    <span z-checkbox></span>
    <span z-checkbox [(ngModel)]="checked">Default Checked</span>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ZardDemoCheckboxDefaultComponent {
  checked = true;
}
 

import { ChangeDetectionStrategy, Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
 
import { ZardCheckboxComponent } from '../checkbox.component';
 
@Component({
  selector: 'z-demo-checkbox-destructive',
  imports: [ZardCheckboxComponent, FormsModule],
  template: `
    <span z-checkbox zType="destructive"></span>
    <span z-checkbox zType="destructive" [(ngModel)]="checked">Destructive Checked</span>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ZardDemoCheckboxDestructiveComponent {
  checked = true;
}
 

import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
 
import { ZardCheckboxComponent } from '../checkbox.component';
 
@Component({
  selector: 'z-demo-checkbox-size',
  imports: [ZardCheckboxComponent, FormsModule],
  standalone: true,
  template: `
    <span z-checkbox>Default</span>
    <span z-checkbox zSize="lg" [(ngModel)]="checked">Large</span>
  `,
})
export class ZardDemoCheckboxSizeComponent {
  checked = true;
}