選択した要素のオブジェクトを使って角型モデルを作成するにはどうすればよいですか？

Question

option要素のオブジェクトを渡すときに、select要素のng-modelに問題があります。だから、私たちはテーブルから列の配列は、（表の定義）columnsと呼ばれていると想像して、私たちは、この定義

var columns = [ 
    {name: 'Account ID', type: 'numeric'}, 
    {name: 'Full name',  type: 'text'}, 
    {name: 'Date of birth', type: 'date'}, 
    {name: 'Active',  type: 'boolean'} 
    // and so on 
]; 

var filters = [{}]; 

HTML時にいくつかのフィルタをレコード生成したいと思います：

<div class="form-field" ng-repeat="filter in filters"> 
    <select ng-model="filter"> 
    <option value="" disabled>Choose filter</option> 
    <option ng-repeat="column in columns" ng-value="column">{{column.name}}</option> 
    </select> 
    <input type="text" ng-model="filter.value"> 
</div> 

することができますように私はcolumnの値を取得することfilterをたいと思い、見て、私のフィルタは可能性がある瞬間ので、それに特定のデータを追加するよう：

[ 
    {name: 'Account ID', type: 'numeric', value: 123}, 
    {name: 'Active', type: 'boolean', value: 'Yes'} 
] 

とにかく、これがこれを行う方法であるかどうかはわかりませんが、コントローラー内の多くのjsコードに書き込むことで、どのようにこの動作を達成できるのかを知りたいと思います。

私はfilterを更新し、typeプロパティを取得、columns配列内の列を見つけ、filterとcolumn.nameを渡し、これはng-changeを使用して成し遂げるためにいくつかの回避策をしましたが、私は本当にへのシンプルな答えがあると思いますこの。

Answer 1

あなたはモデルに選択したオブジェクトをバインドするng-optionsを使用することができます。

<div class="form-field" ng-repeat="filter in filters"> 
    <select ng-options="column.name for column in columns" ng-model="filter.value"> 
     <option value="" disabled>Choose filter</option> 
    </select> 

    <input type="text" ng-model="filter.value.name"> 
</div> 

Plunker

更新答え：

<div class="form-field" ng-repeat="filter in filters"> 
    <select ng-options="column.name for column in columns" ng-model="filters[$index]"> 
    <option value="" disabled>Choose filter</option> 
    </select> 

    <input type="text" ng-model="filters[$index].name"> 
</div>