使用angularjs观察下拉列表的选定值以填充数组取决于所选值

时间:2014-06-26 13:22:34

标签: javascript angularjs select filter

我有这个小提琴HERE

我想检查模型的选定值" sectionSelect",并根据所选的值,确定它的天气" 1"或者" 2",我想用新的值填充newArr,以便相应地过滤最小和最大价格。

我现在正在做的是......

if ($scope.sectionSelect == 1) {

    for($i=0; $i < arr.length; $i++){

        if(arr[$i]['section'] === 1) {
            newArr.push(arr[$i]['value']);
        }
    }

} else if($scope.sectionSelect == 2) {
    for($i=0; $i < arr.length; $i++){

        if(arr[$i]['section'] === 2) {
            newArr.push(arr[$i]['value']);
        }
    }
}

但这似乎不起作用。 我该怎么办?

这就是我的工作http://jsfiddle.net/sheko_elanteko/Anj3w/26/ 我只是想为它添加过滤功能。

1 个答案:

答案 0 :(得分:1)

使用Angular过滤内容的最简单方法是使用内置过滤功能。我在这里更新了你的小提琴:http://jsfiddle.net/CQyTa/

对html的更改使用下拉列表为所选内容设置范围值。然后可以将这些值用作过滤器(在这种情况下,我根据选择的部分过滤最小值和最大值)。

<select ng-model="sectionSelect" ng-options="section.label for section in sections" ng-change="clearMinMax()">
</select>
<select ng-model="minVal" ng-options="item.value for item in app_data | filter:sectionSelect.section | orderBy:'value'">
    <option value="">Min Price</option>
</select>
<select ng-model="maxVal" ng-options="item.value for item in app_data | filter: sectionSelect.section | orderBy:'-value'">
    <option value="">Max Price</option>
</select>

根据这些下拉列表中选择的内容,您可以使用所有内容来过滤应显示的内容。 minMax功能在控制器中,它只是检查值是否在min&amp;最大

<div ng-repeat="item in app_data | filter:sectionSelect.section | filter:minMax | orderBy:'value'">
    {{item.value}}
</div>

如果您有任何疑问,请与我联系!