javascript - Angular Js ng 重复在 div 上显示错误的值

Question

我构建了一个 Angular 应用程序，我正在使用 ng-repeat 将模型中的数据显示到 html View 中。但我得到了错误的值(value)观:

模型看起来像这样:

[{
   id : 1,
   name : 'jijo'
   address : 'addressone',
 },
 {
   id : 2,
   name : 'albert'
   address : 'addressone',
 },

{
   id : 3,
   name : 'moana'
   address : 'addressone',
 },
{
   id : 4,
   name : 'card'
   address : 'addressone',
 }
]

HTML 代码如下所示:

    <section id="main" ng-repeat="(id, name) in data.repo track by id"
    <div id="sub_main_one">
       {{id}} //prints one
     </div>

    <div id="sub_main_two">
       {{id}} //prints one
     </div>

     <div id="sub_main_three">
       {{id}} //prints one
     </div>

     <div id="sub_main_four">
       {{id}} //prints one
     </div>    


     <div id="sub_main_five">
       {{id}} //suppose to be one but prints 4 on the first repeat
     </div>

   </section> 

id 在大多数 div 中打印 1，但在最后一个 div 中它给了我一个错误的值 (4)，这是数组中最后一个对象的 id。我该如何解决这个问题？..

Answer 1

你的代码里少了很多>，那么你的ng-repeat语句是错误的，obj中的(key, value) code> sintax 是迭代对象的属性，而不是迭代数组中的元素(查看 angularjs 文档):

修复:

<section id="main" ng-repeat="item in data">
  <div id="sub_main_one">
     {{item.id}}
     hey
   </div>
  <div id="sub_main_two">
     {{id}}
   </div>
   <div id="sub_main_three">
     {{id}}
   </div>
   <div id="sub_main_four">
     {{id}}
   </div>
   <div id="sub_main_five">
     {{id}}
   </div>
 </section> 

这里是 plunker