当我尝试使用“{{}}”将 matInput 的类设置为一个值时,它出于某种原因更改了格式。这是带有花括号的代码加上它的内容 looks喜欢。
<mat-tab label="1">
<div *ngFor="let name of playerAndID">
<h3>{{ name.name }}</h3>
<mat-form-field class="scoreInput">
<input matInput placeholder="Score" class="{{name.index}}">
</mat-form-field>
</div>
</mat-tab>
如果我将类名更改为其他名称,它会正常显示。 Here's它的外观以及代码:
<mat-tab label="1">
<div *ngFor="let name of playerAndID">
<h3>{{ name.name }}</h3>
<mat-form-field class="scoreInput">
<input matInput placeholder="Score" class="ANYTHING ELSE">
</mat-form-field>
</div>
</mat-tab>
使用花括号时如何防止这种情况发生?我的应用程序的任何其他部分都没有发生此问题。
最佳答案
似乎当您使用 {{}} 指定类时,它会覆盖默认的“mat-input-element mat-form-field-autofill-control cdk-text-field-autofill-monitored”。我能够通过更改 Id 来解决格式问题。
关于css - 更改类名时 matInput 格式的格式更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59004654/