İlk, son, dizin döngüsü için açısal 2 ng

Bu örnekteki ilk örneği varsayılan olarak ayarlamaya çalışıyorum: plunkr

aşağıdaki hatayı alıyorum:

    Unhandled Promise rejection: Template parse errors:
    TypeError: Cannot read property 'toUpperCase' of undefined ("dButtonToggleGroup">
    <md-button-toggle [ERROR ->]*ngFor="let indicador of indicadores; #first = first" value="indicador.id" [checked]="first">"): ng:///AppModule/HomeComponent.html@35:78
    Parser Error: Unexpected token #, expected identifier, keyword, or string at column 31 in [let indicador of indicadores; #first = first] in ng:///AppModule/HomeComponent.html@35:78 ("<md-button-toggle *ngFor="let indicador of indicadores; #first = first" value="indicador.id" [ERROR ->][checked]="first">
    <span>{{ indicado"): ng:///AppModule/HomeComponent.html@35:153

Yanlış olan ne??

angular angular-material

— PriNcee
kaynak

Yanıtlar:

185

Bu plunkr'a bak .

Değişkenlere bağladığınızda, parantez kullanmanız gerekir. Ayrıca, hashtag'i html'nizdeki öğelere referans almak istediğinizde kullanırsınız, şablonların içindeki değişkenleri bunun gibi bildirmek için değil.

<md-button-toggle *ngFor="let indicador of indicadores; let first = first;" [value]="indicador.id" [checked]="first"> 
...

Düzenleme: Christopher Moore'a teşekkürler : Angular, aşağıdaki yerel değişkenleri ortaya çıkarır:

index
first
last
even
odd

— Steveadoo
kaynak

Teşekkür ederim! bu bana çok yardımcı oldu, ancak ilkini kullanmaya çalıştım çünkü bu konuda araştırma yaparken blog.angular-university.io/angular-2-ngfor (Bir listenin ilk ve son öğesini tanımlama)

— PriNcee

Ah tamam. Bunu da yapabilirsiniz. Bunun yerine let i = index, sadece olarak değiştirin let first = first;ve [işaretli] bağlamayı "i == 0" yerine "ilk" i kontrol edecek şekilde değiştirin.

— Steveadoo

Güzel! şimdi çalışıyor! ancak işaretlenen niteliği neden parantezlerle

— bağlamam gerektiğini anlayamıyorum

İçinde @Steveadoo ngForAçısal açığa aşağıdaki yerel değişkenler index, first, last, evenve odd. Gelecekteki kullanıcılar için bu noktayı netleştirmek için yanıtı güncelleyebilir misiniz?

— Christopher Moore

Yerine let first = firstyazabilirsiniz first as isFirst: Burada anlatıldığı gibi (isFirst özel değişkendir) angular.io/api/common/NgForOf#local-variables

— jurl

İşte Angular 6'da nasıl yapılır

<li *ngFor="let user of userObservable ; first as isFirst">
   <span *ngIf="isFirst">default</span>
</li>

Dan değişikliği Not let first = firstiçinfirst as isFirst

— Sebastian Hernandez
kaynak

Çalışması için boruyu |ile değiştirmeniz gerekir ;.

— Florian Moser

let first = firstve first as isFirsther iki bildirimin de kullanımı doğrudur, ikinci takma ad oldukça okunabilir

— Mohan Ram

*ngForBununla, ANGULAR olarak döngüdeki herhangi bir indeksi elde edebilirsiniz ...

<ul>
  <li *ngFor="let object of myArray; let i = index; let first = first ;let last = last;">
    <div *ngIf="first">
       // write your code...
    </div>

    <div *ngIf="last">
       // write your code...
    </div>
  </li>
</ul>

Bu takma adları şurada kullanabiliriz: *ngFor

index: number: let i = indexNesnenin tüm indeksini alır.
first: boolean: let first = firstNesnenin ilk endeksini hesaplamak için.
last: boolean: let last = lastNesnenin son endeksini hesaplamak için.
odd: boolean: let odd = oddNesnenin tek endeksini hesaplamak için.
even: boolean: let even = evenNesnenin hatta dizini alır.

— Rohit Tagadiya
kaynak