drop-down in angularjs

Question

how can I bind drop-down using angularjs

Bidyasagar Mishra · Answer

Hi Harish. try the below code > html > script src = https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js > script > body > div ng-app = myApp ng-controller = myCtrl > select ng-model = selectedName ng-options = x for x in names > select > div > script > var app = angular .module('myApp' []); app.controller('myCtrl' function($scope) { $ scope.names = [Emil Tobias Linus]; }); script > body > html >

Chittaranjan Swain · Answer

Hi Harish Refer below links for More Info. https://www.c-sharpcorner.com/blogs/create-dropdownlist-in-angularjs1 https://www.codementor.io/chrisharrington/angularjs-tutorial-series-part-5-creating-a-dropdown-control-for-your-site-8fys2du2r https://docs.angularjs.org/api/ng/directive/ngOptions https://docs.angularjs.org/api/ng/directive/select https://www.tutlane.com/tutorial/angularjs/angularjs-select-box-dropdown-list-binding-with-validations-example

Chandrasekaran C · Answer

Now open HomeController. By default HomeController will be inheritted by Controller as HomeController:Controller. Change it to HomeController:ApiController and copy the code given below. using AngularwithWebAPI.DbContext; using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Http; //This namespace is responsible for IHttpActionResult using System.Web.Mvc; namespace AngularwithWebAPI.Controllers { publicclassHomeController: ApiController { DbContext.StudentEntities studentEntities = new DbContext.StudentEntities(); publicIHttpActionResult GetStates() { var states = studentEntities.StateMasters.ToList(); return Ok(states); } } Now run your Service Script.js var testApp = angular.module( testModule  []).controller( testController  function($scope $http) { $http. get ( 'http://localhost:50623/api/home/getstates' ).then(function(response) { $scope.states = response.data; }); }); index.html testModule > Scripts/angular.min.js > Scripts/js/Script.js > utf-8 /> testController > 1 > Name text id= txtName ng-model= name /> State stateId data-ng-repeat= st in states value= {{st.StateId}} >{{st.StateName}} City text id= txtCity /> Address text id= txtAddress /> Phone text id= txtPhone /> button id= bttnUpdate value= Update /> In the code used above I used data-ng-repeat which will convert option tag row by the row of StateName. Now one question arises why do I use data-ng-repeat=st in states because I will return the data into my scope model which is $scope.states. stateId data-ng-repeat= st in states value= {{st.StateId}} >{{st.StateName}}

Chittaranjan Swain · Answer

Hi Harish Try this Example- AngularJs Select Box or Dropdown List example AngularJS Select Box or Dropdown List Example --Select-- chitta Mitu Fish