2017-02-27 14 views
1

を使用して、NG-INITのデータを印刷していないと私はいくつかの角度のjs例をしようとしているが、とき2つのdiv要素を作成し、そのための角度jsのプログラムを実行しようとしています。初期化された配列は2番目のdivのために印刷されており、ng-repeatを使用しているときは最初のdivのために印刷されません。誰がなぜそれが起こっているのか教えてもらえますか?私は2つの配列が初期化されている方法の違いを見ることができません。コードは以下の通りです。あなたのコンソールあなたが最初ng-repeatに重複に関するエラーが表示されますで見れば角度jsが、私は初心者ですNGリピート

<html data-ng-app> 
<head> 
<title>Angular js</title> 
</head> 
<body> 
<input type="text" data-ng-model="name">{{name}} 
<div class="container" data-ng-init="namess=['Hello','There','God','There']"> 
<h3>Looping with the ng-repeat Directive</h3> 
    <h4>Data to loop through is initialized using ng-init</h4> 
    <ul> 
     <li data-ng-repeat="Personname in namess">{{Personname}}</li> 
    </ul> 
</div> 
<div class="container" data-ng-init="names=['Dave','Napur','Heedy','Shriva']"> 
    <h3>Looping with the ng-repeat Directive</h3> 
    <h4>Data to loop through is initialized using ng-init</h4> 
    <ul> 
     <li data-ng-repeat="name in names">{{name}}</li> 
    </ul> 
</div> 
</body> 
<footer> 
<script type="text/javascript" src="angular.min.js"></script> 
</footer> 
</html> 

私は取得しています結果は

Looping with the ng-repeat Directive 

Data to loop through is initialized using ng-init 

Looping with the ng-repeat Directive 

Data to loop through is initialized using ng-init 

Dave 
Napur 
Heedy 
Shriva 
+0

。それは。http://jsfiddle.net/cysa0cah/1/ – Nick

答えて

3

以下の通りです。あなたの配列に「あり」を持っているので二回あなたのng-repeattrack byを追加する必要があります。あなたの最初の配列内の重複したエントリがあります

<li data-ng-repeat="Personname in namess track by $index">{{Personname}}</li> 
+0

は私の問題を解決しているありがとうございました作品。 –

1

とコンソールをチェックする場合は、エラー「エラー:[ngRepeat dupes]」を見ることができます。これで、それを交換してみてください。 Angular ngRepeatは重複する値を許可しません。詳細https://docs.angularjs.org/error/ngRepeat/dupesについては、次のリンクを確認してください。

のいずれか、修正重複エントリ(あり)または使用以下を削除するには:$インデックスによってnamessトラックで

<li data-ng-repeat="Personname in namess track by $index">{{Personname}}</li> 

データ-ngのリピート= "PERSONNAME、この問題を修正する必要があり

関連する問題