Angularjs中select 的ng-repeat 和 ng-options 用法和获取选取值

http://blog.csdn.net/manson_zh/article/details/72520604

AngularJS模块化开发中，遇到几次下拉菜单实现搜索功能的案例，现整理一下select中ng-repeat 和ng-options的用法和获取值的方法

一，ng-repeat

1,HTML

<select ng-model="selectedItems" ng-change="chenge()">
<option ng-repeat="x in items" value="{{x.id}}">{{x.name}}option>
select>

<h1>你选择的是: {{selectedItems}}h1>

2,js

app.controller('myCtrl', function($scope) {
   $scope.items = [
        {name: "aaaa", id : "1"},
        {name : "bbbb", id : "2"},
        {name : "ccc", id : "3"}
    ];
  $scope.change = function(){
    //获取被选中的值
    var chengeitem = $scope.selectedItem;
    //js代码实现option值变化后的查询等操作
  }
});

二，ng-options

1,HTML

<select ng-model="selectedItems" ng-options="x.name for x in items">
select>
<h1>name: {{selectedItems.name}}h1>
<h1>id: {{selectedItems.id}}h1>

2,JS

app.controller('myCtrl', function($scope) {
   $scope.items = [
        {name: "aaaa", id : "1"},
        {name : "bbbb", id : "2"},
        {name : "ccc", id : "3"}
    ];
  $scope.change = function(){
    //获取被选中的值
    var chengeitem = $scope.selectedItem;
    //js代码实现option值变化后的查询等操作
  }
});

option值的变化正是实现条件查询的时候，但是又不能用click事件，所以个人感觉用change事件更好用一些。