title: PrimeNg p-table data source with conditional nested object
body: <p>I have a resources array that lists employee data i.e name, role, dept etc..  in addition, each object also has an array showing the each employees' assignments i.e projId, workHrs..</p>
  <p>When building p-table, im unable to single out workHrs for a specific projId in resources.assignments .. what i get, is each assignment object workHrs.</p>
  <p>How can i conditionally retrieve workHrs for a specific projId, along with all the primary employee data ?</p>
  <p><a href="https://stackblitz.com/edit/primeng-table-nested?file=src/app/app.component.html" rel="nofollow noreferrer">stackblitz</a></p>
  <pre><code>.TS
  
    ngOnInit() {
  
      this.columns = [
        { field: 'name', header: 'Resource', width: '20%' },
        { field: 'role', header: 'Role', width: '20%' },
        { field: 'dept', header: 'Dept', width: '20%' },
        { field: 'workHrs', header: 'Work Hrs', width: '20%' }
      ];
  
      this.resources = [
        {
          name: 'Bob',
          role: 'Developer',
          dept: 'CIO',
          assignments: [
            { projId: '001', workHrs: 3 },
            { projId: '002', workHrs: 1 }
          ]
        },
        {
          name: 'Peter',
          role: 'Accountant',
          dept: 'Finance',
          assignments: [
            { projId: '001', workHrs: 6 },
            { projId: '004', workHrs: 8 }
          ]
        }
      ];
  
    }
  </code></pre>
  <pre><code>.HTML
  
  &lt;p-table
    [value]=&quot;resources&quot;
    [columns]=&quot;columns&quot;
    styleClass=&quot;p-datatable-striped&quot;&gt;
    &lt;ng-template pTemplate=&quot;header&quot; let-columns&gt;
      &lt;tr&gt;
        &lt;th *ngFor=&quot;let col of columns&quot; [ngStyle]=&quot;{'width': col.width}&quot;&gt;
          &lt;div&gt;{{col.header}}&lt;/div&gt;
        &lt;/th&gt;
      &lt;/tr&gt;
    &lt;/ng-template&gt;
    &lt;ng-template pTemplate=&quot;body&quot; let-resources let-columns=&quot;columns&quot;&gt;
      &lt;tr&gt;
        &lt;td *ngFor=&quot;let col of columns&quot; [ngStyle]=&quot;{'width': col.width}&quot;&gt;
          &lt;span *ngIf=&quot;col.field !== 'workHrs' &quot;&gt;{{resources[col.field]}}&lt;/span&gt;
  
          &lt;span *ngIf=&quot;col.field == 'workHrs'&quot;&gt;
            &lt;span *ngFor=&quot;let hours of resources.assignments;&quot;&gt;
              {{hours[col.field]}}
            &lt;/span&gt;
          &lt;/span&gt;
        &lt;/td&gt;
      &lt;/tr&gt;
    &lt;/ng-template&gt;
  &lt;/p-table&gt;
  </code></pre>
  <p><strong>Expected Outcome</strong></p>
  <p><a href="https://i.stack.imgur.com/zmI6n.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zmI6n.png" alt="enter image description here" /></a></p>