Problem setting value in field ngValue form Angular

238 views Asked by At

I have the follow code:

.json

0: {stateId: 1, name: "Acre", uf: "AC", countryId: 1, country: {…}}
1: {stateId: 2, name: "Alagoas", uf: "AL", countryId: 1, country: {…}}
2: {stateId: 3, name: "Amazonas", uf: "AM", countryId: 1, country: {…}}
3: {stateId: 4, name: "Amapá", uf: "AP", countryId: 1, country: {…}}
4: {stateId: 5, name: "Bahia", uf: "BA", countryId: 1, country: {…}}
5: {stateId: 6, name: "Ceará", uf: "CE", countryId: 1, country: {…}}
6: {stateId: 7, name: "Distrito Federal", uf: "DF", countryId: 1, country: {…}}
7: {stateId: 8, name: "Espírito Santo", uf: "ES", countryId: 1, country: {…}}
8: {stateId: 9, name: "Goiás", uf: "GO", countryId: 1, country: {…}}
9: {stateId: 10, name: "Maranhão", uf: "MA", countryId: 1, country: {…}}
10: {stateId: 11, name: "Minas Gerais", uf: "MG", countryId: 1, country: {…}}
11: {stateId: 12, name: "Mato Grosso do Sul", uf: "MS", countryId: 1, country: {…}}
12: {stateId: 13, name: "Mato Grosso", uf: "MT", countryId: 1, country: {…}}
13: {stateId: 14, name: "Pará", uf: "PA", countryId: 1, country: {…}}
14: {stateId: 15, name: "Paraíba", uf: "PB", countryId: 1, country: {…}}
15: {stateId: 16, name: "Pernambuco", uf: "PE", countryId: 1, country: {…}}
16: {stateId: 17, name: "Piauí", uf: "PI", countryId: 1, country: {…}}
17: {stateId: 18, name: "Paraná", uf: "PR", countryId: 1, country: {…}}
18: {stateId: 19, name: "Rio de Janeiro", uf: "RJ", countryId: 1, country: {…}}
19: {stateId: 20, name: "Rio Grande do Norte", uf: "RN", countryId: 1, country: {…}}
20: {stateId: 21, name: "Rondônia", uf: "RO", countryId: 1, country: {…}}
21: {stateId: 22, name: "Roraima", uf: "RR", countryId: 1, country: {…}}
22: {stateId: 23, name: "Rio Grande do Sul", uf: "RS", countryId: 1, country: {…}}
23: {stateId: 24, name: "Santa Catarina", uf: "SC", countryId: 1, country: {…}}
24: {stateId: 25, name: "Sergipe", uf: "SE", countryId: 1, country: {…}}
25: {stateId: 26, name: "São Paulo", uf: "SP", countryId: 1, country: {…}}
26: {stateId: 27, name: "Tocantins", uf: "TO", countryId: 1, country: {…}}

.html

 <select class="mda-form-control" [(ngModel)]="States" name="State" #s (change)="getCities(s.value)" aria-placeholder="Select a State">
<option *ngFor="let state of valuesState" [ngValue]="state.stateId" >{{state.name}}</option>
</select>
<label>State</label>

.ts

  getCities(id) {
    this.cityService.getCityByState(id).subscribe(res => {
      this.valuesCity = res;
    });
  }

My problem happens when I'm going to retrieve the select's ngValue. It displays the following error: {"errors":{"id":["The value '35: 9' is not valid."]},"type":"https://tools.ietf.org/html/rfc7231#section-6.5.1","title":"One or more validation errors occurred.","status":400,"traceId":"|ca67e839-4528cad45e494350."}

In addition to the Id they are returning another value 35: 9 and the correct one would be only 9. Can someone help me? thanks,

0

There are 0 answers