Form only showing the first element

44 views Asked by At

I am using Carbon Design System to design a form. The problem that I am facing is that only the first bit is being shown (i.e the input). The textarea underneath doesn't come up. I cannot figure out why this is happening and would really appreciate some help. Here is the HTML:

<main>
  <form (ngSubmit)="processChange.emit(process)" [gap]="6" cdsStack="vertical">
    <h3>Create a new process</h3>
    <div class="form-group">
      <cds-text-label [textInputTemplate]="label">
        Process Name
        <ng-template #label>
          <input [(ngModel)]="process.label" cdsText maxlength="255" name="label" placeholder="Process Name" required
                 [readOnly]="!editable">
        </ng-template>
      </cds-text-label>
    </div>

    <div class="form-group">
      <cds-textarea-label [textAreaTemplate]="description">
        Process Description Here
        <ng-template #description>
        <textarea [readOnly]="!editable" [(ngModel)]="process.description" cdsTextArea name="description"
                  placeholder="Description" class="textarea" required></textarea>
        </ng-template>
      </cds-textarea-label>
    </div>
  </form>
</main>

And the scss:

@use '@carbon/styles/scss/spacing' as *;

main {
  margin-top: $spacing-06;
}

All this does is display the cds-text-label and the input. However, I cannot see the cds-textarea-label and the textarea underneath it. If I flip them around then I will see the textarea but not the input.

0

There are 0 answers