如何在angularjs ng-repeat

时间:2016-10-05 10:48:29

标签: javascript angularjs

“任何机构都可以让我知道在更改ng-repeat内的选择框时调用一个函数,该函数会先发送可用于第二个选择框的数据,但不是全部” 假设我有2个产品

product 1  
select1-on change of this
select2-this should change

product2
select1-on change of this
select2-this should change

但最新发生的是

 product 1  
    select1-on change of this
    select2-is changing

    product2
    select1-
    select2-this is also changing

任何人都可以帮我这个吗?

我有一个ng-repeat循环,其中我有2个选择框,对于第一个选择框我从api调用获取数据,当用户从第一个选择框更改任何选项时我必须获取代码并与其代码完整匹配第二个选择框的数据和供应选项。

但是主要的问题是整个事情我正在循环重复,所以如果从第一个产品中选择第一个选择框有2个或更多产品它会更改所有产品的所有第二个选择框数据。

这是我的代码

<div class="" ng-repeat="product in products ">
    <div ng-show="IsVisible" class="form-group row sub-div vsub-div-fw">
                                            <div class="col-sm-6 fd">
                                                <p class="cust-label" for="pay_opt">Select a plan.</p>
                                                <select ng-change="getPaymentOptions(orders.selectedSub[$index],index)" ng-init="orders.selectedSub[$index] = product.recurrence[0].code"  ng-model="orders.selectedSub[$index]" ng-options="sub.code as sub.name for sub in product.recurrence "  class="input-lg form-control select-community-list" id="pay_opt">
                                                <!-- <option value="">Select Subscription Plan</option> -->
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group row sub-div vsub-div-fw">
                                             <div class="col-sm-6 fd">
                                                <p class="cust-label" for="">Select a payment option.</p>
                                                <select  required="required" ng-model="orders.selectedPayment[$index]" class="input-lg selectPaymentOption paymentOption{{$index}} form-control"  id="" >
                                                <option ng-init="orders.selectedPayment[$index] = product.payment_options[0]" ng-repeat="opt in product.payment_options" value="{{opt}}"  class="myPaymentBox">{{opt.split("_").join(" ") }}</option> 
                                                </select>
                                                <p id="paymentOptionErr{{$index}}" class="alert alert-danger product-error-msg"><i class="fa fa-exclamation-triangle"></i> Please select payment option to proceed.</p>
                                            </div>
</div>

js code

$scope.getPaymentOptions=function(plan,i){
                angular.forEach($scope.products,function(p){
                    angular.forEach(p.recurrence,function(r){
                        if (r.code==plan) {
                            p.payment_options=r.payment_type;
                            $scope.orders.selectedPayment[i] = r.payment_type[0];
                        };
                    });
                })
            }

当我们更改第一个选择框以获取第二个选择框的选项时,将调用上述函数。但是当我们有更多产品时,更改产品的第一个选择框将改变所有第二个选择框选项。如何在变更功能上做出独特的?

0 个答案:

没有答案