JSON数据重复问题

Question

I have included the code in http://codepen.io/sajoambattu/pen/MbezNa 

我有3个div，其中每个div包括颜色选择，内存和调用计划。电话计划数据在每个设备详细信息之后（表格后面）。

所有数据都取决于3个JSON。颜色选择和内存数据来自设备JSON，并且调用计划数据来自callplans JSON。我有另一个JSON（planMapping）来映射设备和通话计划。所有JSON的我都包含在JS文件中。

我的要求是基于用户选择的颜色和内存，应显示相应的通话计划。现在内容正在显示，但我面对的问题是它在所有三个部分（Apple，Samsung和Sony）中显示相同的内容。

问题的示例：

点击iPhone从苹果节6S加上标签，然后点击32GB存储，然后单击任何颜色，现在iPhone 6S加上通话计划将显示。问题是相同的iPhone 6s以及呼叫计划数据也在所有其他部分中显示。

任何帮助，将不胜感激。

Answer 1

我已经更新了你的代码....

http://codepen.io/anon/pen/dOpdXr 

的变化：

HTML：

<div class="planDetails" ng-repeat="data in x.callPlanArr"> 

和也被移动的<div class="device_overview {{x.memory}}-{{x.presales_name.split(' ').join('-').replace('(','').replace(')','')}}" ng-repeat="x in v | orderBy:'memory'" ng-show="$first"></div>移动到结束改性的div。

JS：

item.callPlanArr = []; //at line 5770        

和

item.callPlanArr.push($scope.callplanList.callplans[x]); //5784 

Answer 2

制作如下改动，以满足您的要求：内带class = “device_overview”

这里的div 移分度类= “callPlans” 是修改： -

<div class="device_overview {{x.memory}}-{{x.presales_name.split(' ').join('-').replace('(','').replace(')','')}}" ng-repeat="x in v | orderBy:'memory'" ng-show="$first"> 
         <div class="device_detail"> 
          <p>{{x.presales_vendor}}</p> 
          <h3>{{x.presales_name}}</h3> 
          <p>{{result}}</p> 
         </div> 
         <div class="color"> 
          <div class="color-name"> 
           <p>Choose color:</p> 
           <span ng-repeat="data in x.variants" class="{{data.s_code}}-{{x.presales_name.split(' ').join('-')}}" ng-show="$first">{{data.colour}}</span> 
          </div> 
          <div class="color-code" ng-repeat="data in x.variants" ng-click="changeImg(((data.s_code+' ')+(x.presales_name)).split(' ').join('-').replace('(','').replace(')',''));showPlan(x,data.s_code); showStock(data.s_code);" style="border-color:{{data.colour_code}};background-color:{{data.colour_code}}">{{data.colour_code}}</div> 
         </div> 
         <div class="callPlans" ng-if="device_class == x.device_class"> 
          <div class="planDetails" ng-repeat="data in callPlanArr"> 
           <div class="data"> 
            <p>Data</p> 
            <h3>{{data.plan.data_allowance}}GB</h3> 
           </div> 
           <div class="minute"> 
            <p>Minutes</p> 
            <h3>{{data.plan.call_allowance}}</h3> 
           </div> 
           <div class="text"> 
            <p>Texts</p> 
            <h3>{{data.plan.text_allowance}}</h3> 
           </div> 
           <div class="upfront"> 
            <ul> 
             <li ng-show="data.upfront != ''"><p>&pound;{{data.upfront}}</p>up front</li> 
             <li><h2>&pound;{{data.plan.rental}}/mth</h2></li> 
            </ul> 
           </div> 
          </div> 
         </div> 
        </div> 

，并添加以下行在控制器的$ scope.showPlan（）函数

$scope.device_class = item.device_class;