### File

`projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts`

### Extends

`Field`

### Implements

`OnInit`

### Metadata

selector | `cmn-check-radio`
styleUrls | `./check-radio.component.scss`
templateUrl | `./check-radio.component.html`

### Index

###### Properties
Public form
###### Methods
Public ngOnInit Public onChange Protected addFormValidator Public ngOnInit
###### Inputs
class id isDisabled isRtl label name type

### Constructor

`constructor(viewRef: ViewContainerRef)`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:18
Parameters :
Name | Type | Optional
viewRef | `ViewContainerRef` | No

### Inputs

class
Type : `string`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:17

id
Type : `string`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:12

isDisabled
Type : `boolean`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:16

isRtl
Type : `boolean`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:15

label
Type : `string`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:14

name
Type : `string`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:13

type
Type : `"radio" | "checkbox"`
Default value : `'checkbox'`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:18

### Methods

Public ngOnInit
`ngOnInit()`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:24
Returns : `void`

Public onChange
`onChange()`
Defined in projects/commons/src/lib/elements/check-radio/components/check-radio.component.ts:30
Returns : `void`

Protected addFormValidator
`addFormValidator(name: string, validators: Validators, value: string)`
Inherited from `Field`
Defined in `Field:17`
Parameters :
Name | Type | Optional | Default value
name | `string` | No |
validators | `Validators` | No |
value | `string` | No | `''`
Returns : `void`

Public ngOnInit
`ngOnInit()`
Inherited from `Field`
Defined in `Field:9`
Returns : `void`

### Properties

Public form
Type : `FormGroup`
Inherited from `Field`
Defined in `Field:5`

    import { Component, Input, OnInit, ViewContainerRef } from '@angular/core';

    import { Field } from '../../../core/field/abstract';

    @Component({
        selector: 'cmn-check-radio',
        templateUrl: './check-radio.component.html',
        styleUrls: [ './check-radio.component.scss' ],
    })

    export class CheckRadioComponent extends Field implements OnInit {
        @Input() public readonly id: string;
        @Input() public readonly name: string;
        @Input() public readonly label: string;
        @Input() public readonly isRtl: boolean;
        @Input() public readonly isDisabled: boolean;
        @Input('class') public readonly clazz: string;
        @Input() public readonly type: 'radio' | 'checkbox' = 'checkbox';

        constructor(private readonly viewRef: ViewContainerRef) {
            super(viewRef);
        }

        public ngOnInit(): void {
            super.ngOnInit();

            this.addFormValidator(this.name, []);
        }

        public onChange(): void {
            this.form.get(this.name).setValue(!this.form.get(this.name).value);
        }
    }

    <div [formGroup]="form">
        <input class="is-checkradio {{ clazz }}"
               [formControlName]="name"
               [class.is-rtl]="isRtl"
               [id]="id"
               [type]="type"
               [value]="form.get(this.name).value"
               [disabled]="isDisabled"/>
        <label [for]="id"
               (click)="onChange()">
            {{ label }}
        </label>
        <small>
            <ng-content></ng-content>
        </small>
    </div>

`./check-radio.component.scss`

Legend
Html element
Component
Html element with directive

# result-matching ""

# No results matching ""