如何遍历复杂JSON对象？AngularJS ng-repeat格式化求助

我来帮你搞定这个遍历问题！你遇到的核心问题是：你的message对象里每个属性对应的都是数组类型的错误信息，而你当前的ng-repeat只是遍历了这些数组本身，没有深入到数组里的具体错误字符串。

方案1：嵌套ng-repeat遍历数组元素 #

如果每个字段可能有多个错误信息，推荐用这种方式，它能把所有错误都列出来：

<div style="color: red;" ng-repeat="(fieldKey, errorList) in message">
  <!-- 遍历每个字段下的错误数组 -->
  <div ng-repeat="errMsg in errorList">{{errMsg}}</div>
</div>

这里(fieldKey, errorList)是AngularJS中遍历对象的语法，fieldKey是属性名（比如name、contact_person），errorList就是对应的错误数组，内层的ng-repeat再把数组里的每个错误信息单独显示。

方案2：直接取数组第一个元素（适合单错误场景） #

如果确定每个字段只会返回一个错误，你可以直接访问数组的索引来提取错误字符串，不用嵌套循环：

<div style="color: red;" ng-repeat="errorList in message">
  {{errorList[0]}}
</div>

额外优化：显示字段名（可选） #

要是想把字段名和错误信息一起展示，比如Name: Name cannot be blank.，可以用方案1的fieldKey，还可以简单处理下字段名的格式（比如把下划线转成空格）：

<div style="color: red;" ng-repeat="(fieldKey, errorList) in message">
  {{fieldKey.replace('_', ' ')}}: {{errorList[0]}}
</div>

这样就能得到清晰、格式化的错误提示啦～

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