如何在Angularjs中添加项目的迭代？

Question

我使用ng-repeat循环遍历控制器中的数组。问题是，它不是显示新行中的每个值，而是显示每行中的所有数组值，如下所示：

html代码如下所示：

<div ng-model="wrapper_div" id="wrapper">
    <input type="button" value="Update Data"
    ng-click="updateData()" />
    <ul ng-repeat="x in data">
        <li>{{data}}</li>
    </ul>
</div>

脚本：

var answers = [];
function updateData(data) {

    var scope = angular.element($("#wrapper")).scope();
    scope.$apply(function(){

        answers.push(data);
        scope.data = answers;
    });
}

预期结果应如下所示：

9
6
7

而不是这个：

9,6,7
9,6,7
9,6,7

Answer 1

您正在显示data而不是x，数据是一个数组，因此完整数组会显示三次，而是显示{{x}}尝试

<ul ng-repeat = "x in data"><li>{{x}}</li></ul>

Answer 2

您可能需要将ng-repeat移动到 li 标记，而不是 ul 。在表达式中，使用x而不是数据，这就是为什么每次都要打印整个数组。所以你的HTML应该看起来像：

<div ng-model = "wrapper_div" id="wrapper">
    <input type="button" value="Update Data" ng-click="updateData()"/>
    <ul>
       <li ng-repeat = "x in data">{{x}}</li>
    </ul> 
</div>