我正在嘗試使用 Angular 框架創建一個表單，但是在呈現頁面時我無法顯示兩個以上的欄位。
組件.html
<div class="card m-3">
<div class="card-body">
<form [formGroup]="surveyForm" (ngSubmit)="onSubmit()">
<div class="form-group col-5">
<label>UserName:</label>
<input id="name" type="text" formControlName="fName" class="form-control" [ngClass]="{'is-invalid':submitted && f['fName'].errors}"/>
<div *ngIf="submitted && f['fName'].errors" class="invalid-feedback"></div>
<div *ngIf="submitted && surveyForm.controls['fName'].errors" class="form-control">first name is required</div>
</div>
<div class="form-group col-5">
<label>StudentID:</label>
<input id="StudentId" type="text" formControlName="StudentId" class="form-control" ngClass]="{'is-invalid':submitted && f['StudentId'].errors}"/>
<div *ngIf="submitted && surveyForm.controls['StudentId'].errors" class="form-control">first name is required</div>
</div>
<div class="text-center">
<button type="button" class="btn btn-primary mr-1" (click)="onSubmit()">Submit</button>
<button type="button" class="btn btn-primary mr-1" (click)="onReset()">Reset</button>
</div>
</form>
</div>
</div>
索引.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Survey</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="//netdna.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
rel="stylesheet" />
</head>
<body>
<app-root></app-root>
</body>
</html>
渲染頁面
https://ibb.co/tMs4nNW
uj5u.com熱心網友回復：
打字錯誤，檢查第二個輸入
<input id="StudentId" type="text" formControlName="StudentId" class="form-control" ngClass]="{'is-invalid':submitted && f['StudentId'].errors}"/>
ngClass 屬性未命中 [ 渲染引擎無法正確識別輸入并將其從視圖中排除
嘗試一下
<input id="StudentId" type="text" formControlName="StudentId" class="form-control" [ngClass]="{'is-invalid':submitted && f['StudentId'].errors}"/>
uj5u.com熱心網友回復：
您在指令中有錯字錯誤：
嘗試在 student:ID 下使用 [ngClass] 而不是 ngClass]
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/365487.html
上一篇：單擊按鈕后如何顯示iframe