意外的ng-repeat阵列结果

时间:2017-05-29 15:16:10

标签: javascript angularjs angularjs-ng-repeat

我发现无法保证数组排序。因此,我添加了一个动态数字并将对象嵌套在数组中,以便能够使用编号按顺序获取项目。当我在console.log中时,我按正确的顺序获取项目,但在视图中它们以另一个顺序出现。

我有以下观点:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {

    $('#st_score_form').click(function(event) {
        event.preventDefault();
        alert("Button click");
    });

    $('body').append('<button id="st_score_form">Testbtn</button>');
});
</script>

<html>
<head></head>
<body>
    No content
</body>
</html>

以下JS:`

<div id="objectives-report-single" ng-repeat="(key,value) in widgetItems">
        <tr ng-repeat="(keyInner,valueInner) in value">
            <td class="accountName">{{keyInner}}</td>
            <td class="accountValue">{{valueInner}}</td>
        </tr>
    </table>
</div>

console.log actual result

1 个答案:

答案 0 :(得分:0)

解决。我将它们添加到一个编号的对象数组中,然后在内部ng-repeat中循环显示。因此我使用的原则是数组是有序的,但JS中的对象不是。

    <table class="table">
        <tr ng-repeat="(keyInner,valueInner) in value">
            <td class="accountName">{{keyInner}}</td>
            <td class="accountValue">{{valueInner}}</td>
        </tr>
    </table>

</div>

            var n = 0;
            scope.dynamicObject = {};
            scope.widgetItems = [];
            angular.forEach(scope.report.executeResult.rowData, function (i) {

                var a = scope.report.executeResult.rowData[n].values[0].value;
                var name = 'a';

                scope.dynamicObject = {
                    [eval(name)]: scope.report.executeResult.rowData[n].values[1].value
                };

                scope.widgetItems[n] = scope.dynamicObject;
                n++;


            });