Skip to main content Skip to navigation Skip to search

Angular Components

ClrForm

Selector & Basic Usage

Bindings

Binding Type Options Default Description
[clrLabelSize] input 1,2,3,4... 2 Sets the label size in rem for an input. If they are set it must be minLabelSize <= clrLabelSize <= maxLabelSize.

ClrControlContainer

A generic control container that supports form controls not directly support in Clarity. (e.g app specific controls or third party controls)

#### Selector & Basic Usage ```html
<form clrForm>
  <clr-control-container>
    <label>Required</label>
    <input
      clrControl
      placeholder="Input control"
      name="required"
      [(ngModel)]="model.required"
      pattern="asdfasdf"
      required
      minlength="5"
    />
  </clr-control-container>
  <button class="btn btn-primary" type="submit">Submit</button>
</form>

ClrControlError

Enable error messages per form control.

Selector & Basic Usage

ClrControlHelper

Enable helper messages per form control.

Selector & Basic Usage

Angular Directives

ClrLayout

Use the ClrLayout directive to enable different layouts for the form.

Selector & Basic Usage