角纳克-重复对象的动态数组

Question

给定一个对象数组的json，如何使用ng-重复动态显示它？error键是静态的/始终保持不变。只是error的值发生了变化。因此，如果我的密码字段被错误删除，那么我将在password上使用error密钥。

{ 
  "error":  {
    "firstName": {
      "0": "The first name field is required.",
      "1": "The first name field must have 2-5 characters."
    },
    "lastName": {
      "0": "The last name field is required."
    }
  }
}

。

{ 
  "error":  {
    "password": {
      "0": "The password field is required."
    }
  }
}

我试着做：

<ul ng-repeat="message in errormessage">
    <li ng-repeat="(k,v) in message">
         {{k}} - {{v}}
    </li>
</ul>

但它会显示以下内容：

0 - [
0 - ]

Answer 1

​

angular.module('app', [])
  .controller('SampleCtrl', function($scope) {
    $scope.errormessage = {
      "error": {
        "firstName": {
          "0": "The first name field is required.",
          "1": "The first name field must have 2-5 characters."
        },
        "lastName": {
          "0": "The last name field is required."
        },
        "passowrd": {
          "0": "The password field is required."
        }
      }
    };
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="SampleCtrl">

  <ul ng-repeat="message in errormessage">
    <li ng-repeat="(k,v) in message">
      <b>{{k}}:</b><br>
      <ul>
        <li ng-repeat="err in v">
          {{err}}
        </li>
      </ul>
    </li>
  </ul>
</div>

​

Answer 2

编辑

我认为你必须考虑的第一件事是，如果你能控制你的json，并以这样的方式表示它，你就得把它正常化。

$scope.errormessage = {
  "error": {
        "firstName": {
            "0": "The first name field is required.",
            "1": "The first name field must have 2-5 characters."
        },
        "lastName": {
            "0": "The last name field is required."
        },
        "passowrd": {
             "0": "The password field is required."
        },
        "mail": {
            "0": "The first name field is required.",
            "1": "The first name field must have 2-5 characters."
        },
        "newsletter": {
             "0": "The newsletter field is required."
        },
        "address": {
             "0": "The address field is required."
        }
    }
}

为什么会这样，因为在同一个对象或数组上不能有两个名为error的字段。在此之后，提供的第一个解决方案必须有效。

<div ng-app="app" ng-controller="SampleCtrl">
    <ul ng-repeat="message in errormessage">
       <li ng-repeat="(k,v) in message">
         <b>{{k}}:</b><br>
         <ul>
            <li ng-repeat="err in v">
             {{err}}
            </li>
         </ul>
       </li>
    </ul>
</div>

Answer 3

确保您在正确的对象上使用ng-重复。你有：

ng-repeat="message in errormessage"

errormessage的内容似乎是"[]"。请参阅http://jsfiddle.net/hgk6vsqv/