While Developing a Web App, its a very common behavior to display list of values in a Select tag. Let’s discuss about an Employee Management System where many times we required to display employee names in a dropdownlist. Assume we have a JSON file which contains employee details & the application architecture is with AngularJS. Look at the below example here I am binding JSON formatted data from scope object using AngularJS ng-options.
To show list of employee names here I added for loop inside ng-options “emp.name for emp in empDetails”. Here empDetails is the object which holds JSON formatted data. Due to security reason outside the scope we can’t modify scope data directly. The reason I am cloning empDetails data to emp object inside ng-options. Then using embedded for loop binding emp.name.
Using AngularJS ng-options