<p>Angular TriStateCheckbox is used to select either "true", "false" or "null" as the value.</p>
<h3 id="setup">Setup</h3>
<p>Refer to PrimeNG <a target="_blank" href="https://primefaces.org/primeng/showcase/#/setup">setup documentation</a> for download and installation steps for your environment.</p>
<h3 id="import">Import</h3>
<pre><code class="lang-js"><span class="hljs-keyword">import</span> {TriStateCheckboxModule} <span class="hljs-keyword">from</span> <span class="hljs-string">'primeng/tristatecheckbox'</span>;
</code></pre>
<h3 id="getting-started">Getting Started</h3>
<p>TriStateCheckbox is defined using p-triStateCheckbox element and requires a value binding via ngModel.</p>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-name">p-triStateCheckbox</span> [(<span class="hljs-attr">ngModel</span>)]=<span class="hljs-string">"value"</span> <span class="hljs-attr">label</span>=<span class="hljs-string">"Item Label"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">p-triStateCheckbox</span>&gt;</span>
</code></pre>
<pre><code class="lang-js"><span class="hljs-keyword">export</span> <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">ModelComponent</span> </span>{

    <span class="hljs-attr">value</span>: any;

}
</code></pre>
<h3 id="model-driven-forms">Model Driven Forms</h3>
<p>TriStateCheckbox can be used in a model driven form as well.</p>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-name">p-triStateCheckbox</span> <span class="hljs-attr">formControlName</span>=<span class="hljs-string">"property"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">p-triStateCheckbox</span>&gt;</span>
</code></pre>
<h3 id="theming">Theming</h3>
<p>TriStateCheckbox supports various themes featuring Material, Bootstrap, Fluent as well as your own custom themes via the <a target="_blank" href="https://primefaces.org/primeng/showcase/#/theming">Designer</a> tool.</p>
<h3 id="resources">Resources</h3>
<p>Visit the PrimeNG <a target="_blank" href="https://primefaces.org/primeng/showcase/#/tristatecheckbox">TriStateCheckbox</a> showcase for demos and documentation.</p>


Angular TriStateCheckbox is used to select either "true", "false" or "null" as the value.

### Setup

Refer to PrimeNG [setup documentation](https://primefaces.org/primeng/showcase/#/setup) for download and installation steps for your environment.

### Import

```js
import {TriStateCheckboxModule} from 'primeng/tristatecheckbox';
```

### Getting Started

TriStateCheckbox is defined using p-triStateCheckbox element and requires a value binding via ngModel.

```html
<p-triStateCheckbox [(ngModel)]="value" label="Item Label"></p-triStateCheckbox>
```

```js
export class ModelComponent {

    value: any;

}
```

### Model Driven Forms

TriStateCheckbox can be used in a model driven form as well.

```html
<p-triStateCheckbox formControlName="property"></p-triStateCheckbox>
```

### Theming

TriStateCheckbox supports various themes featuring Material, Bootstrap, Fluent as well as your own custom themes via the [Designer](https://primefaces.org/primeng/showcase/#/theming) tool.

### Resources

Visit the PrimeNG [TriStateCheckbox](https://primefaces.org/primeng/showcase/#/tristatecheckbox) showcase for demos and documentation.