首页 > 解决方案 > 后端是否与前端不兼容(带有外键)?

问题描述

在这里,客户必须插入他的“号码”,“操作员”和“凭证”,我们将“操作员”和“凭证”作为“外键”,在添加客户之前,我们必须检查凭证是否“存在”在“优惠券列表”中......当我们将优惠券和 oparateur 作为组合框时,它可以工作,但问题是优惠券必须是文本区域,另一方面,operator 是组合框。

控制器

@PostMapping("/clients")
public String createClient( @RequestBody Client client,Voucher voucher) {   
    if(client.getOperateur() == null || client.getTel().isEmpty()
            || client.getVoucher() == null) {
        return "client already exist or null";
        }
    if( clientRepository.existsById(client.getVoucher().getCode())) {       
            return "code already exist ";}else {
        voucher.setCode(client.getVoucher().getCode());

        clientRepository.save(client);
        return "client added";
    }

html

<div [hidden]="submitted" > 
<form class="forms-sample" (ngSubmit)="onSubmit()">
    <div class="form-group">
        <label for="tel" ><b>Tel:</b></label>
        <input type="number" class="form-control" id="tel" required [(ngModel)]="client.tel" name="tel"
            placeholder="Tel" autofocus >  </div>  
    <div class="form-group"> 
        <label for="operateur"><b>Operateur:</b></label>
        <select class="form-control" [(ngModel)]="client.operateur" name="operateur" >
      <option *ngFor="let operateur of operateurs"[ngValue]="operateur">
          {{operateur.intitule}}   </option></select>
    </div>  
    <div class="form-group">
        <label for="tel"><b>Voucher:</b></label>
        <input type="number" class="form-control" id="voucher"  required [(ngModel)]="client.voucher" name="voucher"
          placeholder="voucher">
    </div>
    <button type="submit" class="btn mr-2" style="text-align: center;">Executer</button>
</form>
</div>

<div [hidden]="!submitted">
    <h4>Added!</h4>
  </div>

组件.ts

   export class ClientAddComponent implements OnInit {
  client: Client = new Client();
  vouchers: Voucher[];
  operateurs: Observable <Operateur[]>;
  submitted = false;
  constructor(private clientService: ClientService,private voucherService: VoucherService,
    private operateurService: OperateurService,
    private router: Router, private toastrs : ToastrService) { }
  ngOnInit() {
    this.voucherService.getVouchersList().subscribe(data=>{this.vouchers=data})
    this.operateurService.getOperateursList().subscribe(data=>{this.operateurs=data})
  }
  newClient(): void {
    this.submitted = false;
    this.client = new Client();
  }
  save() {
    this.clientService.createClient(this.client)
      .subscribe(data => console.log(data), error => console.log(error));
    this.client = new Client();
    this.gotoList();
    this.toastrs.success('bien ajouté');
  }
 onSubmit() {
this.submitted = true;
this.save();    }}

标签: javascriptangularspringfrontendbackend

解决方案


推荐阅读