I'm trying to use a value in an expression binding. I know this isn't valid but want to know if something similar is possible. If not, is there another way to go about it.
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'Home',
templateUrl: './views/home/home.html'
})
export class HomeComponent implements OnInit{
rows = [
{ 'FirstName': 'John', 'LastName': 'Doe' },
{ 'FirstName': 'Ashley', 'LastName': 'Doe' }
];
cols = [
{ 'Desc': 'First Name', 'Data': 'FirstName' },
{ 'Desc': 'Last Name', 'Data': 'LastName' }
];
}
home.html
<table>
<thead>
<tr>
<th *ngFor="let col of cols">{{col.Desc}}</th>
</tr>
</thead>
<tr *ngFor="let row of rows">
<td *ngFor="let col of cols">
{{row.{{col.Data}}}}
</td>
</tr>
</table>
Use it like this:
In Javascript you can access every property via
obj.propName
ANDobj[propName]
, too!