AngularJS中ng-repeat渲染联系人表格数据失败的问题求助

咱们先定位核心问题：你的ng-repeat写法存在两处关键错误，导致联系人数据无法正常渲染：

1. 遍历目标错误：你写的modalData.contactgroups[0]是contactgroups数组里的单个对象，而非整个数组，ng-repeat需要遍历数组才能生成对应行数的表格。
2. 属性访问路径错误：contactgroups中的每个元素本身并不直接包含gsm/firstname/lastname，这些联系人属性都嵌套在contact子对象里。

修正后的Jade表格代码 #

table.table
  tr
    th GSM
    th First Name
    th Last Name
  tr(ng-repeat='groupItem in modalData.contactgroups')
    td {{groupItem.contact.gsm}}
    td {{groupItem.contact.firstname}}
    td {{groupItem.contact.lastname}}

关键修正点说明 #

• 把遍历目标从modalData.contactgroups[0]改为modalData.contactgroups，让ng-repeat遍历整个联系人分组数组，为每个联系人自动生成一行表格。
• 访问属性时添加.contact前缀（比如groupItem.contact.gsm），匹配你提供的JSON结构——每个contactgroups元素的contact字段才是存储联系人详细信息的对象。

确认JS逻辑正确性 #

你的setModal方法是完全没问题的：点击按钮时传入groups[$index]（即包含contactgroups数组的单个分组对象），赋值给$scope.modalData后，数据层级结构完全符合模板的读取需求。

可选调试技巧 #

如果想直观验证数据绑定是否正常，可以在模板中添加调试输出：

pre {{modalData | json}}

这样能清晰看到modalData的完整结构，确认contactgroups数组及内部contact对象是否正确加载。

内容的提问来源于stack exchange，提问作者Sameer