CODEWITHSUNDEEP
angulartemplatesvariableskeyconcatenation
ofey
ofey

Reputation: 3347

Angular4: Concatenate string to form dynamic key in template

I am trying to dynamically create a key inside the template from an *ngFor index.

<div *ngFor="let col of table; let i = index">
  <span *ngFor="let row of col; let j = index">
    {{ row.ricj }}
  </span>
</div>

where the "i" and "j" in "ricj" are actually the indices "i" and "j". Is this possible?

The original table object is build this way,

makeTable(){
    for(this.c = 0; this.c < this.columnslength; this.c++){
      for(this.r = 0; this.r < this.rowslength; this.r++){
        this.key = "r" + this.r + "c" + this.c;
        this.cell = { [this.key]: this.key };
        this.cols.push(this.cell);
      }
      this.table.push(this.cols);
      this.cols = [];
  }
}

the table object looks like this,

[
   {
      [{ "r0c0": "r0c0" }, { "r1c0": "r1c0" }]
   },
   {
      [{ "r0c1": "r0c1" }, { "r1c1": "r1c1" }]
   }
]

Upvotes: 1

Views: 7291

Answers (1)

alehn96
alehn96

Reputation: 1393

Try this, 

  <div *ngFor="let col of table; let i = index">
    <span *ngFor="let row of col; let j = index">
        {{ row['r' + j + 'c' + i] }}
    </span>
  </div>

Upvotes: 3

Related Questions