Question

我是一些特定的JSON，我必须重复两次，一次为父母一次为孩子。为了避免误解，我尝试在下面提供真实的数据示例。

JSON对象数组：

[{"id":"1fccb481-53a0-400e-8831-80acd1793bee","euroCode":"7812BGSHABW","position":"REAR","category":"REAR_WINDOW","glassPartType":"GLASS","description":"TODO: DECODE 7812BGSHABW","calculatedPrice":15768.00,"operation":"REPLACE","selectionSource":"MANUAL","linkedParts":[]},{"id":"71e1dc3b-47a2-4406-970a-ef0911c93396","euroCode":"7812AGSHMVZ","position":"FRONT","category":"FRONT_WINDOW","glassPartType":"GLASS","description":"TODO: DECODE 7812AGSHMVZ","descriptionByUser":"TEST DESC","calculatedPrice":5749.50,"priceByUser":574.22,"operation":"REPLACE","selectionSource":"MANUAL","linkedParts":[{"id":"0f45cd6b-7053-4625-8ec9-87281c126e1d","partNumber":"LSD","description":"LEPÍCÍ SADA","calculatedPrice":562.50,"selectionSource":"AUTOMATIC","enabled":true},{"id":"61bbbdad-1838-4327-8c38-8808a35a403c","partNumber":"string","description":"GEL POD SENZOR","calculatedPrice":87.48,"selectionSource":"AUTOMATIC","enabled":true}]}]

在这里你可以看到有些对象，但有些对象（在这种情况下是第二个）有子对象linkedParts。每个元素，无论其linkedParts或主元素是否必须位于表中的<tr>

如何查找上面的特定JSON：

我的代码如下：

<tr ng-repeat-start="part in axCalculation.selectedParts">
    <td class="text-center">{{part.euroCode}}</td>
    <td class="text-center">{{part.modifiedDesc ? part.modifiedDesc : part.description}}</td>
    <td class="text-center">{{part.modifiedPrice ? part.modifiedPrice : part.calculatedPrice}}</td>
    <td class="text-center">
        <button class="btn btn-info btn-xs" ng-click="toggle = ! toggle">
            <span class="glyphicon glyphicon-edit"></span>
        </button>
        <button class="btn btn-warning btn-xs" ng-click="axCalculation.remove(part.id)">
            <span class="glyphicon glyphicon-remove"></span>
        </button>
    </td>
</tr>

<!--linkedParts part start-->
<tr ng-if="part.linkedParts.length" ng-repeat="linkedPart in part.linkedParts">
    <td class="text-center" ng-class="{'line-through': linkedPart.enabled == false}">
        -- {{linkedPart.partNumber}}
    </td>
    <td class="text-center" ng-class="{'line-through': linkedPart.enabled == false}">
        {{linkedPart.modifiedDesc ? linkedPart.modifiedDesc : linkedPart.description}}
    </td>
    <td class="text-center" ng-class="{'line-through': linkedPart.enabled == false}">
        {{linkedPart.modifiedPrice ? linkedPart.modifiedPrice : linkedPart.calculatedPrice}}
    </td>
    <td class="text-center">
        <button class="btn btn-info btn-xs" ng-click="$parent.toggle = ! $parent.toggle">
            <span class="glyphicon glyphicon-edit"></span>
        </button>
        <button class="btn btn-warning btn-xs" ng-click="axCalculation.removeLinkedPart(part.id, linkedPart)">
            <span class="glyphicon glyphicon-remove"
                  ng-class="{'glyphicon glyphicon-remove': linkedPart.enabled == true,
                    'glyphicon glyphicon-share-alt': linkedPart.enabled == false}">
            </span>
        </button>
    </td>
</tr>
<!--linkedParts part end-->

<tr ng-if="toggle" ng-repeat-end>
    <td colspan="6" class="text-left">
        <div class="row noleftpadding">
            <label>Price</label>
            <input ng-model="part.priceByUser"><br>
            <label>Desc</label>
            <textarea ng-model="part.descriptionByUser"></textarea>
        </div>
        <div class="row noleftpadding">
            <button class="btn btn-primary" ng-click="axCalculation.updateValues(part.id, part.priceByUser, part.descriptionByUser)" type="button" />
        </div>
    </td>
</tr>

正如您在最后注意到的那样，<tr>已命名，应显示何时切换为true

问题：

当它有linkedParts时，主要元素的切换不会显示在它下面（HTML显而易见，但在我计划代码时不适合我）。所以我需要显示每个下面的元素点击来自。 所以正确的应该是这样的：
切换按钮atm对linkedPart元素不起作用，单击该按钮什么也不做，但切换值正在改变true / false。所以我需要修复点击toggle <tr>以及

我知道这是一个复杂的问题，不容易解决，但更像是学习我正确思考。我会很高兴任何建议或工作的例子。谢谢，伙计们。

如何在ng-repeat中使用ng-repeat来切换元素

0 个答案: