AngularJS select / ng-options

时间:2016-12-21 10:22:34

标签: javascript angularjs

目前我停留在选择输入字段上。在项目中使用了这段代码:

<select ng-init="crtController.order.orders[$index].quantity = 0" ng-model="crtController.order.orders[$index].quantity" ng-options="value for value in crtController.quantity.values track by value" ng-change="crtController.quantity.check()"></select>

正在使用这个“数量”变量:

this.quantity = {
        values: [0,1,2,3,4,5,6,7,8,9,10],
        decrease: function(index) {
            if (vm.order.orders[index].quantity > 0) {
                vm.order.orders[index].quantity--;
                this.check();
            }
        },
        increase: function(index) {
            if (vm.order.orders[index].quantity < 10) {
                vm.order.orders[index].quantity++;
                this.check();
            }
        },
        check: function() {
            this.valid = false;
            for (var i = 0; i < vm.order.orders.length; i++) {
                if (vm.order.orders[i].quantity > 0) {
                    this.valid = true;
                }
                vm.order.orders[i].productId = vm.products[i].id;
            }
            vm.calculatePrice();
        }
    }

在这个选项的顶部,我有一个变量product.stock。假设这是5.在这种情况下,我只希望它从数量数组中显示0,1,2,3,4,5。

我已经尝试了几件事: 1.添加“where”子句。这似乎不起作用,或者我当然以错误的方式实现它。 2.添加了一个过滤器,不太确定如何使用value变量和product.stock变量,但我试了一下。 我试图改变它,所以重复是一个选项。这样就可以“隐藏”不应该显示的选项。

<select ng-init="crtController.order.orders[$index].quantity = 0" ng-model="crtController.order.orders[$index].quantity" ng-change="crtController.quantity.check()">
                                        <option ng-repeat="value in crtController.quantity.values track by value" value="{{value}}" ng-hide="product.stock < value" ng-bind="value"></option>
                                    </select>

但这似乎不起作用,因为selectbox的第一个值现在为空。旁边的按钮围绕选择选项:

<div class="input-group-addon hidden-xs"><a class="min" ng-click="crtController.quantity.decrease($index)">-</a></div>

似乎不再起作用了。我也访问了很多类似的Stackoverflow问题,但仍未找到我的解决方案。问题如: AngularJs conditional display for ng-options:我的数组中没有这个,但是只检查了两个变量。

2 个答案:

答案 0 :(得分:3)

不确定我是否理解问题,但尝试通过ng-if inside

更改ng-hide

<option ng-repeat="value in crtController.quantity.values|limitTo:product.stock track by $index" value="{{value}}" ng-if="product.stock >= value" ng-bind="value"></option>

答案 1 :(得分:0)

您可以尝试过滤选项

rewind()

只是玩这个,我希望它有所帮助