Question

我有一个变量“选项”，其中包含一个列表['a', 'b', 'c']，就像下面的<h3>一样。

现在我想为列表中的每个元素创建一个按钮，索引附加到id和value，并在按钮中显示文本。

这是我的代码，但是我只得到一个空按钮。怎么了？

<h3>{{options}}</h3>
<form id="choice" name='form' method="POST" action="/" ng-repeat="i, option in options">
    <button id="button{{i}}" type="submit" value="{{i}}">{{option}}</button>
</form>

编辑：我使代码更容易，但仍未显示<span>中的任何3个选项，但它正确显示了<h3>中的列表。是否需要安装才能运行ng-repeat？我在angular.min.js

中有<head>

<h3>{{options}}</h3>
<form id="choice" name='form' method="POST" action="/" ng-repeat="option in options">
    <span>{{option}}</span>
</form>

我在标题中有这个：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

Answer 1

似乎只是缺少括号。在你的情况下应该是ng-repeat="(i, option) in options"。

https://docs.angularjs.org/api/ng/directive/ngRepeat

UPD ng-repeat也应该是第一个示例中<button>的属性和第二个示例中<span>的属性。除非您想在页面上显示3个表单。

Answer 2

只需确保您在options数组中有正确的列表，然后尝试使用它，如

<h3>{{options}}</h3>
<form id="choice" name='form' method="POST" action="/" ng-repeat="option in options">
     <button id="button{{$index}}" type="submit">{{option}}</button>
</form>

在循环中使用Angular创建多个按钮

2 个答案: