title: Angular dataSource doesn't sort
body: <p>I'm trying to make header names into clickable sorting buttons.
  From what I understand of the code, it gains data from &quot;projects&quot;.
  After following different tutorials, I presume I have to replace &quot;projects&quot; with a sorted datasource in order to sort data. Because of that, I tried making a sorted datasource using &quot;projects&quot;.</p>
  <p>When I type projects into new <code>MatTableDataSource</code> it turns into <code>this.projects</code> and it gives me this error:</p>
  <blockquote>
  <p>Argument of type 'Record&lt;string, Project&gt;' is not assignable to parameter of type 'Project[]'.
  Type 'Record&lt;string, Project&gt;' is missing the following properties from type 'Project[]': length, pop, push, concat, and 26 more.ts(2345)
  (property) ProjectsComponent.projects: Record&lt;string, Project&gt;</p>
  </blockquote>
  <p>Can anybody give me advise? My classmate thinks the error means that <code>MatTableDataSource</code> doesn't know what's inside projects. But I don't know what to do about that.</p>
  <p>HTML</p>
  <pre><code>&lt;form [formGroup]=&quot;newProjectForm&quot; (ngSubmit)=&quot;addProject()&quot; *ngIf=&quot;projects&quot;&gt;
  &lt;table mat-table [dataSource]=&quot;projects | keyvalue &quot; matSort class=&quot;mat-elevation-z8&quot;&gt;
  &lt;ng-container matColumnDef=&quot;Name&quot;&gt;
  &lt;th mat-header-cell *matHeaderCellDef mat-sort-header&gt; Name &lt;/th&gt;
  </code></pre>
  <p>TS</p>
  <pre><code>  public projects !: Record&lt;string, Project&gt;;
    public previousProjects !: Record&lt;string, Project&gt;;
    public columns = ['Name', 'Intermediaries', 'Client', 'Address', 'Contact', 'ContactEmail', 'Billable', 'NeedsRemark', 'Delete'];
    public submitting : boolean = false;
    
  //Needs to contain projects inside. I don't know how to insert it properly yet.
    dataSource = new MatTableDataSource();
  
  
   ngAfterViewInit() {
      this.dataSource.sort = this.sort;
    }
  </code></pre>
  <p>Examples of tutorials that I tried:
  <a href="https://material.angular.io/components/table/overview" rel="nofollow noreferrer">https://material.angular.io/components/table/overview</a>
  <a href="https://www.youtube.com/watch?v=NSt9CI3BXv4&amp;t=1321s" rel="nofollow noreferrer">https://www.youtube.com/watch?v=NSt9CI3BXv4&amp;t=1321s</a></p>
  <p>Edit: I think I get projects from a dbService and the dbService receive data from an inputFieldTemplate in the HTML.</p>