Return to Question

The following scenario would be pretty easy in javascript but I got some problems getting it worked in Angular.

I got an Array like:

array a = ( "id" = 0, name = random(), column = 1, 2 or 3, blockrow= 1, 2 or 3)

With ngFor I try to create now a grid there all elements out of a get separated in colums and blocks in this column. So my current code (works but nasty).

<div *ngFor="let a of a">
  <template *ngIf="a.column=='1'">
    <div *ngFor="let b of a">
      <template *ngIf="b.blockrow=='1'">
        Block 1 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template *ngIf="b.blockrow=='2'">
        Block 2 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template *ngIf="b.blockrow=='3'">
        Block 3 in column 1{{b.name}}
      </template>
    </div>
  </template>
</div>

Something like this do I run for every column. Which means I loop trough the same array for 12 times. Is there any way to do it more beautifull ?

The following scenario would be pretty easy in javascript but I got some problems getting it worked in Angular.

I got an Array like:

array a = ( "id" = 0, name = random(), column = 1, 2 or 3, blockrow= 1, 2 or 3)

With ngFor I try to create now a grid there all elements out of a get separated in colums and blocks in this column. So my current code (works but nasty).

<div *ngFor="let a of a">
  <template [ngIf]="a.column=='1'">
    <div *ngFor="let b of a">
      <template [ngIf]="b.blockrow=='1'">
        Block 1 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template [ngIf]="b.blockrow=='2'">
        Block 2 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template [ngIf]="b.blockrow=='3'">
        Block 3 in column 1{{b.name}}
      </template>
    </div>
  </template>
</div>

Something like this do I run for every column. Which means I loop trough the same array for 12 times. Is there any way to do it more beautifull ?

The following scenario would be pretty easy in javascript but I got some problems getting it worked in Angular.

I got an Array like:

array a = ( "id" = 0, name = random(), column = 1, 2 or 3, blockrow= 1, 2 or 3)

With ngFor I try to create now a grid there all elements out of a get separated in colums and blocks in this column. So my current code (works but nasty).

<div *ngFor="let a of a">
  <template [ngIf]="a.column=='1'">
    <div *ngFor="let b of a">
      <template [ngIf]="b.blockrow=='1'">
        Block 1 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template [ngIf]="b.blockrow=='2'">
        Block 2 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template [ngIf]="b.blockrow=='3'">
        Block 3 in column 1{{b.name}}
      </template>
    </div>
  </template>
</div>

Something like this do I run for every column. Which means I loop trough the same array for 12 times. Is there any way to do it more beautifull ?

The following scenario would be pretty easy in javascript but I got some problems getting it worked in Angular.

I got an Array like:

array a = ( "id" = 0, name = random(), column = 1, 2 or 3, blockrow= 1, 2 or 3)

With ngFor I try to create now a grid there all elements out of a get separated in colums and blocks in this column. So my current code (works but nasty).

<div *ngFor="let a of a">
  <template *ngIf="a.column=='1'">
    <div *ngFor="let b of a">
      <template *ngIf="b.blockrow=='1'">
        Block 1 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template *ngIf="b.blockrow=='2'">
        Block 2 in column 1{{b.name}}
      </template>
    </div>
    <div *ngFor="let b of a">
      <template *ngIf="b.blockrow=='3'">
        Block 3 in column 1{{b.name}}
      </template>
    </div>
  </template>
</div>

Something like this do I run for every column. Which means I loop trough the same array for 12 times. Is there any way to do it more beautifull ?