2013-07-29 8 views
19

AngularJS ng-repeatを使用する際にいくつか問題があります。私が持っているものは次のとおりです。ng-repeatを使ってAngularJSの配列を反復処理することはできますか?

<div ng:show="selected == 3"> 
    <div class="columns"> 
     <textarea rows="4" data-ng-model="modal.data.answer[1].text" cols="91">1</textarea> 
    </div> 
    <div class="columns"> 
     <label>Explanation</label> 
     <textarea rows="2" data-ng-model="modal.data.answer[1].explanation" cols="91"></textarea> 
    </div> 
    <div class="columns"> 
     <div class="colx2-left"> 
      <span class="label">Correct</span> 
      <input type="checkbox" data-ng-model="modal.data.answer[1].correct" class="check-box"><input type="hidden" value="false" name="Details[0].Correct"> 
     </div> 
     <div class="colx2-right"> 
      <label>Image File</label> 
      <input type="text" data-ng-model="modal.data.answer[1]image" class="full-width"> 
     </div> 
    </div> 
</div> 

modal.data.answer配列には常に6つの要素があります。 ng-repeatを使用してこれらのHTMLを作成し、配列内の[x]個の数字を繰り返して、「selected =」の最初の行の数字を3から8に増やすことはできますか?以下のよう

私の知る限り、私は<div ng-repeat="t in [3,4,5,6,7,8]"> </div>を使用することができます知っているが、どのように私は物事に、tの値を得ることができるよう:あなたの編集は正しい方法で向かっている

+0

なぜあなたはそれを行うことができないのかわかりません。ng:showとng:repeatはお互いに依存しません。あなたはそれを行うことができるはずです..試してみてください。 – Madushan

+1

ドキュメントの範囲を超えて繰り返すような単純な例は見当たりませんので、私はそれを行う方法がわかりません:http://docs.angularjs.org/api/ng.directive:ngRepeatより良い。素晴らしい製品ですが、ドキュメントは本当に私のために失望しています.-(私は、ページの下部に膨大な数のコメントと質問があるので、私だけではないと思います。 – Alan2

答えて

21

、あなたは整数のリストを反復処理することができます簡単に、あなたはちょうどあなたがhttp://jsfiddle.net/DotDotDot/tweyS/試してみたい場合、私はバイオリンを作ったこと

<div ng-repeat="t in [3,4,5,6,7,8]"> 
.... 
data-ng-model="modal.data.answer[t].text" 
... 

ようにあなたのインデックスの値を使用します(入力フィールドがに、あなたのコードサンプルのように、選択した値を変更するにはちょうどここにあります正しいフィールドを表示するために)

おもしろい

16

リピーターでの重複は許可されていません。固有のキーを指定するには、 'track by'式を使用します。

<div ng-repeat="n in [42, 42, 43, 43] track by $index"> 
    {{n}} 
    </div> 
関連する問題