Christopher Feldhues
Christopher Feldhues

Reputation: 37

Angular Material Input: Bug with many input fields

I have a problem with the Forms Module of Angular Material! I try to create a tag with many Angular Material Basic Inputs. But on the website, only one Input field appears. The other input fields only show the value of the field. Now, when i click on the first input field, then the other fields appear correctly, but only when i click on the first input field?

Before i clicked on the first input field

And after

<form class="example-form" style="margin-top: 15px">
  <mat-form-field class="example-full-width">
    <mat-label>Favorite food</mat-label>
    <input matInput placeholder="Ex. Pizza" value="Sushi" disabled>
  </mat-form-field>

  <mat-form-field class="example-full-width">
    <mat-label>Favorite food</mat-label>
    <input matInput placeholder="Ex. Pizza" value="Sushi" disabled>
  </mat-form-field>
</form>

Upvotes: 2

Views: 1037

Answers (1)

ForestG
ForestG

Reputation: 18123

It seems that in your case, there might be some render errors. I suspect this as you have a disabled button in the template, but on your screenshots they do not appear to be so.

Check you Browser console. (F12 o CTRL+SHIFT+i) If you refresh your app, can you see any errors? Those can make the app work in undeterministic ways. In the command line, where your run ng serve do you see any errors maybe? Fix these first, and try again.

Upvotes: 1

Related Questions