title: PrimeNg table not sorting array of classes in angular
body: <p>The team data is stored in json format and converted into a Team class that is not sorted on default in the ptable.</p>
  
  <p>I have double checked I have all the imports and added sortable columns that work but the table still will not sort on default.</p>
  
  <p>standings.html</p>
  
  <pre><code>&lt;p-table [value]="teams" sortField="seed" sortOrder="1"&gt;
      &lt;ng-template pTemplate="colgroup"&gt;
          &lt;colgroup&gt;
              &lt;col [style.width]="'50px'"&gt;
              &lt;col [style.width]="'105px'"&gt;
              &lt;col [style.width]="'55px'"&gt;
              &lt;col [style.width]="'60px'"&gt;
              &lt;col [style.width]="'60px'"&gt;
              &lt;col [style.width]="'70px'"&gt;
              &lt;col [style.width]="'60px'"&gt;
          &lt;/colgroup&gt;
      &lt;/ng-template&gt;
      &lt;ng-template pTemplate="header"&gt;
          &lt;tr&gt;
              &lt;th [pSortableColumn]="'seed'"&gt;Seed&lt;/th&gt;
              &lt;th&gt;Team&lt;/th&gt;
              &lt;th [pSortableColumn]="'wins'"&gt;Wins&lt;/th&gt;
              &lt;th [pSortableColumn]="'losses'"&gt;Losses&lt;/th&gt;
              &lt;th [pSortableColumn]="'ptsFor'"&gt;Points For&lt;/th&gt;
              &lt;th [pSortableColumn]="'ptsAgainst'"&gt;Points Against&lt;/th&gt;
              &lt;th&gt;Streak&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/ng-template&gt;
      &lt;ng-template pTemplate="body" let-team&gt;
          &lt;tr class="body"&gt;
              &lt;td&gt;{{ team.seed }}&lt;/td&gt;
              &lt;td&gt;&lt;a routerLink="/details/{{ team.id }}"&gt;{{team.team}}&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;{{ team.wins }}&lt;/td&gt;
              &lt;td&gt;{{ team.losses }}&lt;/td&gt;
              &lt;td&gt;{{ team.ptsFor }}&lt;/td&gt;
              &lt;td&gt;{{ team.ptsAgainst }}&lt;/td&gt;
              &lt;td&gt;{{ team.streak }}&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/ng-template&gt;
  &lt;/p-table&gt;
  </code></pre>
  
  <p>standings.component.ts </p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { DataService } from '../data.service';
  import { Observable } from 'rxjs';
  import { TableModule } from 'primeng/table';
  import { Team } from '../entities/Team';
  
  @Component({
    selector: 'app-standings',
    templateUrl: './standings.component.html',
    styleUrls: ['./standings.component.scss']
  })
  export class StandingsComponent implements OnInit {
  
    teams: Team[];
    title: string;
  
    constructor(private data: DataService) { }
  
    ngOnInit() {
      this.title = "League Standings";
      this.teams = [];
      this.data.getTeams().subscribe(
        res =&gt; {
          for(let i=0; i&lt; res.length; i++){
            let tmp = res[i];
            this.teams.push(
              new Team(tmp.seed, tmp.id, tmp.team, tmp.opponent, 
              tmp.scores, tmp.against, tmp.record, tmp.streak, tmp.players)
            )      
          }
        }
      );
    }
  }
  </code></pre>
  
  <p>example of a team object from the json</p>
  
  <pre><code>{
          "seed": 4,
          "id": "ABL",
          "team": "The Airballers",
          "opponent": ["PRF","MBD","PRC","PRG","BRK","PRF","MBD"],
          "record": ["W", "W", "L", "L", "W", "L", "L"],
          "wins": 0,
          "losses": 0,
          "scores": [84,61,54,56,79,89,76],
          "avgPts": 0,
          "ptsFor": 0,
          "against": [55,54,62,59,59,92,77],
          "ptsAgainst": 0,
          "streak": "L2",
          "players": ["p1", "p2", "p3", "p4", "p5", "p6"]
      }
  </code></pre>
  
  <p>the Team entity, where the functions called are just doing calculations</p>
  
  <pre><code>export class Team {
      seed: number;
      id: string;
      team: string;
      opponent: string[];
      record: string[];
      wins: number;
      losses: number;
      scores: number[];
      ptsFor: number;
      against: number[];
      ptsAgainst: number;
      players: string[];
      avgPts: number;
      streak: string;
  
      constructor(seed: number, id: string, team: string, opponent: string[], scores: number[], against: number[], record: string[], streak: string, players: string[]) {
          this.seed = seed;
          this.id = id;
          this.team = team;
          this.opponent = opponent;
          this.scores = scores;
          this.avgPts = this.avgPoints(scores);
          this.ptsFor = this.totalPoints(scores);
          this.against = against;
          this.ptsAgainst = this.totalPoints(against);
          this.record = record;
          this.wins = this.getWins(record);
          this.losses = this.getLosses(record);
          this.streak = streak;
          this.players = players;
      }
  </code></pre>
  
  <p>I expect the teams to be sorted by team when the website loads but they are not</p>