使用Angular創建多個按鈕循環

我有一個變量「options」，其中包含一個列表['a', 'b', 'c']，並且像這樣顯示在<h3>下面。使用Angular創建多個按鈕循環

現在我想爲列表中的每個元素創建一個按鈕，索引被附加到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？我在<head>

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

的angular.min.js我有這樣的標題：

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

來源

2016-11-18 Arturo

你嘗試分組'（I，選項）'括號？ –

我剛剛做了，但仍然失敗。我用一個仍然失敗的簡單示例編輯我的問題。 – Arturo

控制檯中的任何錯誤？ –

看來它只是缺少括號。你的情況應該是ng-repeat="(i, option) in options"。

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

UPD另外ng-repeat應的<button>在第一實施例和在第二個的屬性的<span>。除非你想在頁面上有3個表單。

來源

2016-11-18 17:11:40 leitasat

似乎仍然失敗。我編輯了一些更多的信息我的問題 – Arturo

哦，我明白了。您需要將'ng-repeat'移動到''標籤。 Angular使一個標籤'ng-repeat'的多個實例成爲屬性。 @Arturo – leitasat

只要確保你有選擇陣列中正確的列表，然後嘗試使用它像

<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>

來源

2016-11-18 17:13:07

它不明白美元指數是... – Arturo

使用Angular創建多個按鈕循環

回答

相關問題