Köşeli 2: dinamik olarak div'ler oluşturun

Question

Veritabanından aldığım bir değere dayanarak, açısal 2'de (önyükleme sınıfları ile) div'ler oluşturmak istiyorum. Örneğin, db'den 6 kategori aldım, böylece ekranda 2 div.col-md-6'ya sahip 3 div.row'a dönüşecek. Bunu yapmak için Angular'da bir for döngüsünü nasıl yazabilirim?

düzenleme: aksi takdirde bunu sormak için, ngFor'u yalnızca tekil dizinlerde oluşturmak için nasıl kullanabilirim?

Answer 1

Sorunuzu tam olarak cevaplayabilmek için, nesne/dizi yapınızı görmeniz gerekir.

neyse, burada kontrol girerdim onun Tek ise:

<div *ngFor="let x of anyArray; let even = even; let odd = odd"> 
    <div *ngIf="odd">odd</div> 
    <div *ngIf="even">even</div> 
</div> 

GÜNCELLEME sizin verilen yapıyla

Kolay yapılacaklarıma:

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 

     <div *ngFor="let row of data" class="any class you want here"> 
     <div *ngFor="let item of row" class="any class you want"> 
      {{ item.id + ': ' + item.name }} 
     </div> 

     <br /> <!-- just to demonstrate a visual effect here! :) --> 
     </div> 

    </div> 
    `, 
}) 
export class App { 
    name:string; 

    data = [ 
    [{id:1,name:'name1'},{id:2,name:'name2'}], 
    [{id:3,name:'name3'},{id:4,name:'name4'}], 
    [{id:5,name:'name5'},{id:6,name:'name6'}] 
    ]; 

    constructor() { 
    this.name = 'Angular2' 
    } 
} 

canlı demo: https://plnkr.co/edit/XjS25h19Rjny4N6OVhN1?p=preview

Ya da ilk d kullanarak ata yaklaşımı ve bir boru vasıtasıyla:

canlı demo: https://plnkr.co/edit/8P15VdkWS4Oy02Ezevpp?p=preview