save(): void { this.isSaving = true; const contract = this.createFromForm(); if (contract.id !== undefined) { this.subscribeToSaveResponse(this.contractService.update(contract)); } else { this.subscribeToSaveResponse(this.contractService.create(contract)); } } 这是一段angular前端的代码我现在想要在这段代码中加一个校验就是如果contract.serialNum字段的数据在数据库中已经存在那么就不继续向下执行并给出一个弹窗提示编号已存在
时间: 2024-03-16 17:45:46 浏览: 131
this.$toast() 了解一下?
你可以在 `if (contract.id !== undefined)` 的语句块中添加一个校验函数,检查 `contract.serialNum` 是否已经存在于数据库中。如果存在,可以使用 Angular Material 的 `MatDialog` 组件弹出一个提示框。
下面是一个可能的实现:
```typescript
import { MatDialog } from '@angular/material/dialog';
import { ContractService } from './contract.service';
// ...
constructor(
private dialog: MatDialog,
private contractService: ContractService
) {}
// ...
save(): void {
this.isSaving = true;
const contract = this.createFromForm();
if (contract.id !== undefined) {
this.subscribeToSaveResponse(this.contractService.update(contract));
} else {
this.contractService.findBySerialNum(contract.serialNum).subscribe(existingContract => {
if (existingContract) {
this.dialog.open(MyDialogComponent, {
data: { message: '编号已存在' }
});
} else {
this.subscribeToSaveResponse(this.contractService.create(contract));
}
});
}
}
```
在上面的代码中,`findBySerialNum` 是一个从 `ContractService` 中获取已有合同的函数,它会返回一个 `Observable`,用于异步获取数据。`MyDialogComponent` 是一个自定义弹窗组件,你需要根据自己的需要创建它。
阅读全文