如何使用angularjs将下拉列表的选定值绑定到我的模型

时间:2014-12-12 06:18:51

标签: asp.net-mvc angularjs select angularjs-scope

我想使用angularjs将选中的countryId绑定到我的类CountryId和Selected Stateid Value to StateId。

我的国家/地区下拉列表已成功加载。

这是我的模特:

public partial class Friends
    {
        public int Id { get; set; }
        public string firstname { get; set; }
        public string lastname { get; set; }
        public string address { get; set; }
        public string postalcode { get; set; }
        public string notes { get; set; }
        public Nullable<int> CountryId { get; set; }
        public Nullable<int> StateId { get; set; }
    } 

这是我的观点:

 <select data-ng-model="newfriend.country2" data-ng-options="c as c.Name for c in allItems" data-ng-change="">
                <option value="">-- Select Country --</option>
            </select>


            <label>State:</label>
            <select data-ng-model="newfriend.state2" data-ng-disabled="!newfriend.country2" data-ng-options="s.Id as s.Name for s in newfriend.country2.State">
                <option value="">-- Select State --</option>
            </select>

这是我用一种方法获取两个国家/地区的控制器方法:

public JsonResult GetCountryState()
        {
            var Data = db.Country.Select
                                (
                                    d => new CountryModel
                                    {
                                        Id = d.Id,
                                        Name = d.Name,
                                        State = d.State.Select
                                        (
                                             x => new StateModel
                                             {
                                                 Id = x.Id,
                                                 Name = x.Name
                                             }
                                        ).ToList()
                                    }
                                ).ToList();
            return Json(Data, JsonRequestBehavior.AllowGet);
        }

这是我对Add Controller方法的调用:

$http.post('../Home/AddFriends', this.newfriend).success(function (data) {}

我的控制器方法,我想将我的值绑定到FriendsModel):

 public ActionResult AddFriends(Friends FriendsModel)
        {
         }

任何人都可以帮助我???

1 个答案:

答案 0 :(得分:2)

我创建了一个基本的plunker

http://plnkr.co/edit/Wylq6UOuh7XBV7aX7OAL?p=preview

$scope.states=[{id:1,name:'state1'}, {id:2,name:'state2'}, {id:3,name:'state3'}, {id:4,name:'state4'}]



<select data-ng-model="selectedState">
  <option data-ng-repeat="state in states" value="{{state.id}}">{{state.name}}</option>
</select>

初始化控制器中的selectedState,例如:$scope.selectedState =1;这将使state1成为默认选择选项。