Angular html select issue

Question

As you can see from the links below, when loading the page the first time, the first select uses its first option to display "select street". Then I select a city and the first select shows the corresponding streets.

The issue is, when I choose one street and then click on another city, the select tag which displays the streets, does not show the "Select street" option, but the first index (if you use the dropdown you will see the option "Select street"). How can I make it display "Select street" (first option) each time I change the city option?

editor : https://stackblitz.com/edit/angular-hwqst6

html url : https://angular-hwqst6.stackblitz.io

You bind the select boxes to a model, and you change the model: angular.io/guide/forms. Or you use a reactive form, and you change the value of the form control bound to the select: angular.io/guide/reactive-forms — JB Nizet
– JB Nizet, Commented Nov 25, 2018 at 22:59
links to a 3rd party code repository are not a replacement for a minimal reproducible example in the question body. You will get more useful responses if you edit your question and add code showing the problem you are experiencing. — Claies
– Claies, Commented Nov 25, 2018 at 23:18

Nick Wang · Accepted Answer · 2018-11-26 06:22:47Z

1

Looks you did some change on your demo, I can't keep the city selected now. Please refer to the following code:

onCitySelected(){
    this.retrievedStreets.length = 0;
    this.retrievedStreets = Object.assign(this.retrievedStreets, this.myObj[this.form.value.city].streets);
    this.form.patchValue({street: null});
}
//you can remove the method lookupStreets

edited Nov 26, 2018 at 6:22

answered Nov 26, 2018 at 3:51

Nick Wang

6243 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

YoussHark Over a year ago

Issue is after selecting a street and then changing the city, the default option "select street" does not appear as placeholder like in the beginning

Nick Wang Over a year ago

@YoussefHarkati try it, it is ok on your demo.

Collectives™ on Stack Overflow

Angular html select issue

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related