Question

我是angularjs的新手，并且有一个嵌套的json。我需要访问子数组并获取数据并将其打印在面板中。 json响应是动态的，并且有所不同。到目前为止，我已经对json进行了硬编码。

我使用了自定义指令来形成动态面板。随着阵列的增长，面板也随之增长。

我必须获取子数组中的数据。问题是，我无法获取子列表中的两个数组。如果sub_list中有多个scenario_sub，则仅打印最后一个。我要两个都打印。

有什么办法解决这个问题？

Answer 1

问题与您提供的JSON有关，Sub_list虽然是and数组，但包含在该数组的单个对象内。此外，您的JSON有多个错误。这是您可以引用的有效JSON，

$scope.itemsList = [
        {
            Scenario_id: '1',
            Scenario_desc: 'Invoice Not Found',
            Scenario_overall_status: 'Positive',
            sub_list: [
                {
                    Scenario_sub: {
                        sub_result_id: 'a',
                        sub_result_msg: 'Invoice #6787898989 was already finalized',
                        sub_result_status: '9'
                    }
                },
                {
                    Scenario_sub: {
                        sub_result_id: 'b',
                        sub_result_msg: 'BP004 is IDLE',
                        sub_result_status: '0'
                    }
                }
            ]
        },
        {
            Scenario_id: '2',
            Scenario_desc: 'Invoice is in scheduled status.',
            Scenario_overall_status: 'Positive',
            sub_list: [
                {
                    Scenario_sub: {
                        sub_result_id: 'a',
                        sub_result_msg: 'Invoice #6787898989 was already finalized',
                        sub_result_status: '9'
                    }
                },
                {
                    Scenario_sub: {
                        sub_result_id: 'b',
                        sub_result_msg: 'BP004 is IDLE',
                        sub_result_status: '0'
                    }
                }
            ]
        },
        {
            Scenario_id: '3',
            Scenario_desc: 'Invoice is in scheduled status.',
            Scenario_overall_status: 'Positive',
            sub_list: [
                {
                    Scenario_sub: {
                        sub_result_id: 'a',
                        sub_result_msg: 'Invoice #6787898989 was already finalized',
                        sub_result_status: '9'
                    }
                },
                {
                    Scenario_sub: {
                        sub_result_id: 'b',
                        sub_result_msg: 'BP004 is IDLE',
                        sub_result_status: '0'
                    }
                }
            ]
        },
        {
            Scenario_id: '4',
            Scenario_desc: 'Invoice is not found in smart',
            Scenario_overall_status: 'Negative',
            sub_list: [
                {
                    Scenario_sub: {
                        sub_result_id: 'a',
                        sub_result_msg: 'Invoice #6787898989 was already finalized',
                        sub_result_status: '9'
                    }
                },
                {
                    Scenario_sub: {
                        sub_result_id: 'b',
                        sub_result_msg: 'BP004 is IDLE',
                        sub_result_status: '0'
                    }
                }
            ]
        }
    ];
}

此外，请通过清楚地显示嵌套来保持代码的可读性。

 <div ng-repeat="item in itemsList">
    {{item.Scenario_id}}
    <div ng-repeat="subList in item.sub_list">
       {{subList.Scenario_sub.sub_result_id}}
    </div>
 </div>

这是代码库供参考：CODEPEN

我希望这会有所帮助。

使用ng repeat时覆盖json中的项目

1 个答案: