0
I started recently with WEB development and have studied ANGULAR to deal with some cases in my work. I have five select options that lists through an api some records based on my return {} , displayed by my interpolations, these same ones usually appear to list, but when I use the click event to trigger an event that calls a function from which it consumes the api, it removes the records from the list leaving only the selected item displayed and without having to change the element from that list. Follows the code:
<nb-select placeholder="Regional" style="width:19%" ngModel="result">
<nb-option *ngFor="let i of regional" [value]="i" id="{{i.codigo_regional}}"
(click)="findPendenciaRegional($event)">
{{i.nome_regional}}
</nb-option>
</nb-select>
Function that consumes API and takes the data that is returned to get popular list in HTML:
findPendenciaRegional(event) {
this.pendencia = [];
this.regional = [];
this.pendenciaFisicoApiService.pendencias({
"criterio_de_data": "",
"data_de": "",
"data_ate": "",
"codigo_regional": event.currentTarget.id,
"codigo_comercial": "",
"codigo_loja": "",
"codigo_matriz": "",
"codigo_funcionario": ""
})
.then((s) => {
this.regional = s.agrupado_regional;
this.pendencia = s.dados;
})
.catch((e) => {
console.log(e);
});
}
Put the code findPendenciaRegional()
– Leonardo Getulio
I edited it so it would display correctly.
– Wanderson Bueno
Check for me, please. Your code generates a list that populates the select, when you click this select it must download new data and fill the select with new data, this is it?
– Leonardo Getulio
Also put there the JSON of
this.regional
before being modified and the JSON ofs.agrupado_regional
. So it helps us run tests and help us find the problem.– Leonardo Getulio
It generates the list to fill the select, when I click it fetches me the records that is caught by
event.currentTarget.id
I wish that after the data was returned, I could again select another name to perform other searches... Even because I still have to implement a filter in order to return me based on a business rule, only certain names. I can’t post because it’s an extended size.– Wanderson Bueno
Well, is the query overriding your select values, is this your intention or is it an encoding failure? 2º Put there at least 3~5 items of the values I asked for. Otherwise it is difficult to try to help by "direction"/osmosis/spiritual power.
– Leonardo Getulio
The intention is to return me after clicked, only the values of the function that consumes the API. But in select continue giving options I can select another name, understand? return:
JSON
 { "agrupamento_regional:
 [ { "codigo_comercial": 244
, "nome_comercial": "BRUNA FERNANDA CARLOTA ALVES" 
}
 ], 

 "dados: [
 {

 "codigo_convenio": 1911,
 "codigo_instituicao": 35,
 "codigo_matriz": 161,
 "codigo_regional": 29,

} 

– Wanderson Bueno
No, I didn’t get it right. You need to enter new values in select according to the data coming from the API?
– Leonardo Getulio
No. The select is only to return according to business rule. I have 4 more select which are from other views. It’s like a filter. If I select Leonardo Getulio who is a regional X, will return me the information of Leonardo Getulio, regional X with the pending Y.
– Wanderson Bueno
Then there is a flaw in your code, read carefully: in the option you loop "for" in the "regional" array that is filled with the values you want in the select. When you click on an option, you trigger "findPendenciaRegional()" which changes the value "this.regional" which is the select model by changing the select indirectly by removing its previous values.
– Leonardo Getulio
You should manipulate the result of "findPendenciaRegional" in another variable without being "regional".
– Leonardo Getulio
That’s exactly what it was, good! I just need to see how I’m going to filter it now. But thank you!
– Wanderson Bueno
What is the logic of your filter?
– Leonardo Getulio
First return the or (the) values selected, since I declared the fields as multiple. The API already returns me "filtered" if I pass the appropriate code.
– Wanderson Bueno
Your message was not complete enough for me to provide you with a solution, it would be ideal for you to say something like: I receive an array with the fields x, y and z, and I would like to filter those that the field y is equal to the value "valueEmployment". If you have filter via API and it is enough for you I strongly suggest using.
– Leonardo Getulio
Fair. I have the 5 select with the options being list according to the function of findPendenciaRegional. By level would be: Regional, Commercial, Headquarters, Store and Employee. What I meant is that the API brings me values if I pass parameters, for example:

{
 "criterio_de_data": "",
 "data_de": "",
 "data_ate": "",
 "codigo_regional":"29",
 "codigo_comercial":"",
 "codigo_loja": "",
 "codigo_matriz":"",
 "codigo_funcionario":""
}

– Wanderson Bueno
the return would be: { "grouped commercial": [ { "commercial code": 244, "commercial name": "BRUNA FERNANDA CARLOTA ALVES" } ],
– Wanderson Bueno
If I do not pass parameter in the API call, it returns all the codes of all my select (the regional, commercial, function...) This is identified by the token that determines the views. But there is a general one that can go filtering, to each selection that is called by the code of each agent, whether commercial, regional etc... So each agent has his responsibility determined and by him is identified by the code "agent", this I could not take to put in select and filter.
– Wanderson Bueno