Populate drop down from database with Angular in .net


I'm attempting to learn ASP.net and Angular at the same time. What I want to do is display a list of states (which is retrieved in from a database) in a drop down list using Angular. I can get the states to display in a table. This is what I have:

My Controller function:

public ActionResult StateListDistinct()
    var distinctStates = (from w in db.Addresses
                              select new { State =    

        List<string> states = db.Addresses.Select(state => state.address_state).Distinct().ToList();

        return View(states);


My current View:

@model List<String>

<table class="table">

@foreach (var item in Model) {

            @Html.DisplayFor(model => item)



What do I need to do to get a drop down populated using Angular?

Problem courtesy of: user1024941


You can visit the below link for learning dropdown binding using AngularJs


You can also visit this link http://www.aspdotnet-suresh.com/2015/02/angularjs-bind-set-dropdownlist-value-text-using-ng-options-ng-repeat.html

Solution courtesy of: Moni Bhattacharya


There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.