当从选项元素传递对象时,在select元素上,我有一个ng-model的问题.所以,我们想象一下从列表(表的定义)的表中可以创建一列数组,我们想在这个定义上创建一些过滤器
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>
如您所见,我希望该过滤器能够获取列的值,并在其中添加特定数据,因此在某一时刻,我的过滤器可能如下所示：
[
{name: 'Account ID',type: 'numeric',value: 123},type: 'boolean',value: 'Yes'}
]
无论如何,我不知道这是这样做的方式,但是我想知道如何实现这个行为,而不是写入控制器中的多个js代码.
我做了一些解决方法来完成这一工作,使用ng-change,传递过滤器和column.name,找到列数组中的列,获取类型属性,更新过滤器,但我真的认为有一个更简单的答案这个.
您可以使用
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>
更新答案：
<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>
