Question

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

我有3个div，其中每个div包括颜色选择，记忆和通话计划。每个设备详细信息（在表格之后）都有呼叫计划数据。

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

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

问题示例：

点击苹果部分的iPhone 6s plus标签，点击32GB内存，然后点击任意颜色，现在将显示iPhone 6s和通话计划。问题是同样的iPhone 6s以及呼叫计划数据也会在所有其他部分显示。

任何帮助都将不胜感激。

Answer 1

进行以下更改以满足您的要求：使用class =＆＃34; callPlans＆＃34;移位div在div中使用class =＆＃34; device_overview＆＃34;

以下是修改： -

>>> from shapely.geometry import Polygon, mapping
>>> sh_polygon = Polygon(((0,0), (1,1), (0,1)))
>>> mapping(sh_polygon)
{'type': 'Polygon', 'coordinates': (((0.0, 0.0), (1.0, 1.0), (0.0, 1.0), (0.0, 0.0)),)}

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

    <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>

Answer 2

我已更新您的代码....

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

变更：

HTML：

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

并且</div>移动<div class="device_overview {{x.memory}}-{{x.presales_name.split(' ').join('-').replace('(','').replace(')','')}}" ng-repeat="x in v | orderBy:'memory'" ng-show="$first">已移至已修改div的末尾。

JS：

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

和

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

数据重复JSON的问题

2 个答案: