我在 HTML 中創建了一個帶有必填欄位，然后是一個帶有 ng-click=add() 的提交按鈕。
代碼如下：
輸入名字： <div class="mb-3">
<label class="form-label">Enter surname:</label>
<input type="text" class="form-control" placeholder="Person surname" ng-model= "newPerson.surname" required>
</div>
<div class="mb-3">
<label class="form-label">Enter age:</label>
<input type="text" class="form-control" placeholder="Person age" ng-model= "newPerson.age" required>
</div>
<div class="mb-3">
<label class="form-label">Enter occupation:</label>
<input type="text" class="form-control" placeholder="Person occupation" ng-model= "newPerson.occupation" required>
</div>
<button type="submit" class="btn btn-primary" ng-click="add()">Add</button>
</form>
按下按鈕時，它會添加該人，然后它告訴我這些欄位是必需的，但在我的串列中，該人已經存在將未定義的值。
我也在檔案的頂部宣告了。
謝謝
uj5u.com熱心網友回復：
您也可以使用驗證方法來驗證提交時的輸入，而不是必需的。例子
public validateForm() {
if(newPerson.surname === null ||
newPerson.surname === undefined || newPerson.surname === " ")
{
error.surname = "Surname is required";
}
if(newPerson.age === null ||
newPerson.age === undefined || newPerson.age === " ")
{
error.age = "Age is required";
}
if(newPerson.occupation === null ||
newPerson.occupation === undefined || newPerson.occupation === " ")
{
error.occupation = "Occupation is required";
}
if(newPerson.surname !== null ||
newPerson.surname !== undefined || newPerson.surname !== " " ||
newPerson.age !== null ||
newPerson.age !== undefined || newPerson.age !== " " ||
newPerson.occupation !== null ||
newPerson.occupation !== undefined || newPerson.occupation !== "
)
{
this.add();
}
} <div class="mb-3">
<label class="form-label">Enter surname:</label>
<input type="text" class="form-control" placeholder="Person surname" ng-model= "newPerson.surname" required>
</div>
<span *ngIf="error.surname"> {{error.surname}}</span>
<div class="mb-3">
<label class="form-label">Enter age:</label>
<input type="text" class="form-control" placeholder="Person age" ng-model= "newPerson.age" required>
</div>
<span *ngIf="error.age"> {{error.age}}</span>
<div class="mb-3">
<label class="form-label">Enter occupation:</label>
<input type="text" class="form-control" placeholder="Person occupation" ng-model= "newPerson.occupation" required>
</div>
<span *ngIf="error.occupation"> {{error.occupation}}</span>
<button type="submit" class="btn btn-primary" ng-click="validateForm()">Add</button>
</form>轉載請註明出處，本文鏈接：https://www.uj5u.com/net/476170.html