@Component({
selector: 'app-create-applicability',
templateUrl: './create-applicability.component.html',
styleUrls: ['./create-applicability.component.css']
})
export class CreateApplicabilityComponent implements OnInit {
createForm: FormGroup;
private _createAplicabilty: Model.ApplicabilityModel;
private dataSourcePayment: Model.TypePaymentItem[];
private dataSourceDelivery: Model.TypeDeliveryItem[];
constructor(private _createAppService: ApplicabilityService, private builder: FormBuilder) {
this.createForm = this.builder.group({
name: '',
context: '',
typePaymentDetailsModel: '',
typeDeliveryDetailsModels: '',
marketPlace: ''
})
}
ngOnInit() {
this._createAppService
.getAllDelivery<Model.Result<Model.TypeDeliveryItem>>()
.subscribe((data: Model.Result<Model.TypeDeliveryItem>) => {
this.dataSourceDelivery = data.itens;
});
this._createAppService
.getAllPayment<Model.Result<Model.TypePaymentItem>>()
.subscribe((data: Model.Result<Model.TypePaymentItem>) => {
this.dataSourcePayment = data.itens;
});
}
onPostCreateApplicability(){
let formValue = this.createForm.value;
debugger;
this._createAplicabilty = {
name: formValue.name,
context: formValue.context,
typePaymentDetailsModel:{
id: formValue.id,
sgpTypePaymentId: formValue.sgpTypePaymentId,
name: formValue.name
},
typeDeliveryDetailsModels:{
id: formValue.id,
sgpTypeDeliveryId: formValue.sgpTypeDeliveryId,
name: formValue.name
},
marketPlace: formValue.marketPlace
};
debugger;
this._createAppService.postCreateApplicability(this._createAplicabilty)
.subscribe( success => {
if(success.Result){
}
},
error =>{
}
);
}
}
My Model
declare namespace Model{
export interface ApplicabilityModel{
name: string,
context: string,
typePaymentDetailsModel: TypePayment,
typeDeliveryDetailsModels: TypeDelivery,
marketPlace: boolean
}
export interface TypePayment{
id: string,
sgpTypePaymentId: number,
name: string
}
export interface TypeDelivery{
id: string,
sgpTypeDeliveryId: number,
name: string
}
}
My Model Result
export interface ApplicabilityItem{
name: string,
context: string,
typePaymentDetailsModel: TypePaymentItem,
typeDeliveryDetailsModels: TypeDeliveryItem,
marketPlace: boolean
}
export interface TypePaymentItem{
id: string,
sgpTypePaymentId: number,
name: string
}
export interface TypeDeliveryItem{
id: string,
sgpTypeDeliveryId: number,
name: string
}
My HTML.
<div class="container">
<form [formGroup]="createForm" (ngSubmit)="onPostCreateApplicability()" style="width:400px; margin: 0 auto;">
<h1>Criar Aplicabilidade</h1>
<div class="required-field-block">
<input formControlName="name" type="text" placeholder="Nome" class="form-control">
<div class="required-icon">
<div class="text">*</div>
</div>
</div>
<div class="required-field-block">
<input formControlName="context" type="text" placeholder="Contexto" class="form-control">
<div class="required-icon">
<div class="text">*</div>
</div>
</div>
<div>
<mat-form-field>
<mat-select formControlName="typePaymentDetailsModel" placeholder="Tipo de Pagamento" name="payment">
<mat-option *ngFor="let payment of dataSourcePayment" [value]="payment.id">
{{payment.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div>
<mat-form-field>
<mat-select formControlName="typeDeliveryDetailsModels" placeholder="Tipo de Entrega" name="delivery">
<mat-option *ngFor="let delivery of dataSourceDelivery" [value]="delivery.id">
{{delivery.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<button type="submit" class="btn btn-primary" >Criar</button>
</form>
</div>
By Swagger the API expects this
{
"id": "string",
"name": "string",
"context": "string",
"typeDeliveryDetailsModels": [
{
"id": "string",
"sgpTypeDeliveryId": 0,
"name": "string"
}
],
"typePaymentDetailsModel": [
{
"id": "string",
"sgpTypePaymentId": 0,
"name": "string"
}
],
"marketPlace": true
}
Mounting the code below in the Postman typePaymentDetailsModel comes empty
{
"name": "tesando a bagaça",
"context": "contexto-bagaça",
"typeDeliveryDetailsModels": [
{
"id": "75c7fdbb-82b7-4e2f-ac03-3696883820f4",
"sgpTypeDeliveryId": 1,
"name": "Bahia"
}
],
"typePaymentDetailsModel": [
{
"id": "00dfea8b-4265-42d2-842a-2b854bfcc4dc",
"sgpTypePaymentId": 2,
"name": "Crédito"
}
],
"marketPlace": true
}
Postman return with the above code
{
"id": "ec32d1bc-5d36-4875-83dc-829d2b9b4dcc",
"name": "tesando a bagaça1",
"context": "contexto-bagaça1",
"typePaymentDetailsModels": [
{
"id": "00dfea8b-4265-42d2-842a-2b854bfcc4dc",
"sgpTypePaymentId": 2,
"name": "Crédito"
}
],
"typeDeliveryDetailsModels": [],
"marketPlace": true
}
The problem is that when I enter, it returns a (400) bad request . How do I resolve this?