Question

我有一个包含修改实体的修订/历史信息的json，它包含旧的和新的值。使用https://github.com/benjamine/jsondiffpatch生成Diff，并且我自己进行了额外的解析，以形成要呈现的最终json格式。

示例数据：

[
  {
    "createdBy": "admin@localhost",
    "modifiedAt": 1445113889873,
    "left": [
      {
        "Status": "Open"
      }
    ],
    "right": [
      {
        "Status": "In Progress"
      }
    ]
  },
  {
    "createdBy": "admin@localhost",
    "modifiedAt": 1445114315786,
    "left": [
      {
        "Description": "hello"
      },
      {
        "Assignee": "Uncle Bob (test@test)"
      }
    ],
    "right": [
      {
        "Description": "bye"
      },
      {
        "Assignee": "Willy Wonka (willy@hello)"
      }
    ]
  }
]

我正在寻找一种很好的方法来为此形成一个表，对于每个修订版，我在单独的行上分别得到左右列和值。可能很累，但我无法弄清楚ng-repeat会如何解决这个问题：

<div ng-repeat="(key, value) in vm.revisions | orderBy:'-modifiedAt'">
      <table class="table">
        <thead>
        <tr>
          <th width="20%">Field</th>
          <th width="40%">Old Value</th>
          <th width="40%">New Value</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <td></td>
          <td></td>
          <td></td>
        </tr>
        </tbody>
      </table>
    </div>

我希望得到这样的结果：

提前致谢！

Answer 1

如果我对数据格式是对的：

<div ng-repeat="revision in vm.revisions | orderBy:'-modifiedAt'">
  <table class="table">
    <thead>
      <tr>
        <th width="20%">Field</th>
        <th width="40%">Old Value</th>
        <th width="40%">New Value</th>
      </tr>
    </thead>
    <tbody ng-repeat="(index, left) in revision.left">
      <tr ng-repeat="(field, leftValue) in left">
        <td>{{field}}</td>
        <td>{{leftValue}}</td>
        <td>{{revision.right[index][field]}}</td>
      </tr>
    </tbody>
  </table>
</div>

在jsfiddle上查看：http://jsfiddle.net/q6zqgfr8/

使用ng-repeat生成diff视图

1 个答案: