Кутовий 2 нг для першого, останнього циклу індексу


86

Я намагаюся встановити за замовчуванням перший випадок у цьому прикладі: plunkr

отримання наступної помилки:

    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

що не так??

Відповіді:


175

Ознайомтесь із цим додатком .

Коли ви прив'язуєтеся до змінних, вам потрібно використовувати дужки. Крім того, ви використовуєте хештег, коли хочете отримати посилання на елементи у вашому html, а не для оголошення змінних всередині шаблонів таким чином.

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

Редагувати: Завдяки Крістоферу Муру : Angular виставляє такі локальні змінні:

  • index
  • first
  • last
  • even
  • odd

Дякую! це мені так допомогло, але я спробував використати перший, оскільки шукаючи про нього, я знайшов кілька прикладів, таких як: blog.angular-university.io/angular-2-ngfor (Визначення першого та останнього елементів списку)
PriNcee

Ну гаразд. Ви також можете це зробити. Замість цього let i = indexпросто змініть його на let first = first;та змініть [перевірене] прив'язку, щоб просто перевірити "перший" замість "i == 0".
Steveadoo

приємно! зараз працює! але я взагалі не можу зрозуміти, чому я повинен прив'язувати перевірений атрибут дужками
PriNcee

29
@Steveadoo в ngForкутових викриттів наступні локальні змінні index, first, last, evenі odd. Не могли б ви оновити відповідь, щоб пояснити цей момент для майбутніх користувачів?
Крістофер Мур,

2
Замість let first = firstвас ви можете писати first as isFirst(isFirst - це спеціальна змінна), як описано тут: angular.io/api/common/NgForOf#local-variables
jurl

57

Ось як це зроблено в Angular 6

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

Зверніть увагу на зміну з let first = firstнаfirst as isFirst


Вам потрібно замінити трубу |на, ;щоб вона працювала.
Флоріан Мозер,

let first = firstі first as isFirstобидві декларації правильні для використання, другий псевдонім майже читається
Мохан Рам

0

Цим ви можете отримати будь-який індекс у *ngForциклі в ANGULAR ...

<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>

Ми можемо використовувати ці псевдоніми в *ngFor

  • index: number: let i = indexЩоб отримати весь індекс об'єкта.
  • first: boolean: let first = firstЩоб отримати перший індекс об'єкта.
  • last: boolean: let last = lastЩоб отримати останній індекс об'єкта.
  • odd: boolean: let odd = oddЩоб отримати непарний індекс об'єкта.
  • even: boolean: let even = evenОтримати навіть індекс об'єкта.
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.