lazarov lazarov - 4 months ago 50
Javascript Question

UNIQUE filter ng-repeat Angular. Hide the duplicate values in columns not whole rows

Lets say I have this object :

$scope.men= [
{
age: 21,
name: "John"
},
{
age: 21,
name: "Daenerys"
},
{
age: 21,
name: "Sansa"
}
{
age: 50,
name: "Cersei"
},
{
age: 50,
name: "No one"
},
{
age: 50,
name: "Gregor"
}];


Now in the html view I want to represent a table which will look like this :

-------------------
| age | name |
-------------------
| 21 | Jhon |
-------------------
| | Daenerys|
-------------------
| | Sansa |
-------------------
| 50 | Cersei |
-------------------
| | Gregor |
-------------------


I tried UI-Angular but it didn't work out well. I need a filter like 'unique' but with a little modification.

EDIT:
My goal is to hide the duplicate values in the column 'age'.

Answer

Another simple and straight forward solution is to do a turnary check.

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <table>
      <thead>
        <tr>
          <th>Age</th>
          <th>name</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="m in men track by $index">
          <td>{{men[$index-1].age !== m.age ? m.age : ''}}</td>
          <td>{{m.name}}</td>
        </tr>
      </tbody>
    </table>
  </body>

Full plnkr.