Angular2 Template parse errors: Property binding ngFor not used by any directive on an embedded template

Question

This is the Angular2 template:

<paper-dropdown-menu label="Country">
        <paper-listbox class="dropdown-content" [(ngModel)]="selectedCountry" (ngModelChange)="GetAdmin1s($event)">
            <paper-item *ngFor="let country of countries" value="{{country.Id}}">{{country.Name}}</paper-item>
        </paper-listbox>
    </paper-dropdown-menu>

I am getting this error:

"Template parse errors:
Property binding ngFor not used by any directive on an embedded template (""dropdown-content" [(ngModel)]="selectedCountry" (ngModelChange)="GetAdmin1s($event)">
            [ERROR ->]<paper-item *ngFor="let country of countries" value="{{country.Id}}">{{country.Name}}</paper-item>
 "): LocationComponent@4:12
Property binding ngForCountry not used by any directive on an embedded template (""dropdown-content" [(ngModel)]="selectedCountry" (ngModelChange)="GetAdmin1s($event)">
            [ERROR ->]<paper-item *ngFor="let country of countries" value="{{country.Id}}">{{country.Name}}</paper-item>
 "): LocationComponent@4:12"

Countries variable is defined as:

public countries: Array<Country> = [];

What is wrong with my use of ngFor? Why is it looking for ngForCountry?

Please post a plunkr, [I'm unable to reproduce this](http://plnkr.co/edit/j9e98h2sNv49Md9i95Sn?p=preview) (feel free to fork that one) — drew moore, May 14 '16 at 03:34
I just upgraded to rc.1 and I'm still getting an error. I'm trying to do the plunkr with all the dependencies involved. — Jonas Arcangel, May 14 '16 at 06:15

score 1 · Accepted Answer · answered May 14 '16 at 05:52

1

Just try might help

  <paper-dropdown-menu label="Country">
    <paper-listbox class="dropdown-content" [(ngModel)]="selectedCountry" (ngModelChange)="GetAdmin1s($event)">
        <paper-item ngFor #country [ngForOf]="countries" value="{{country.Id}}">{{country.Name}}</paper-item>
    </paper-listbox>
  </paper-dropdown-menu>

answered May 14 '16 at 05:52

mayur

3,558
23
37

I think this worked. I'm getting an error in another part of the code instead. "No value accessor for '' in [selectedCountry in LocationComponent@3:48]" – Jonas Arcangel May 14 '16 at 06:42
@JonasArcangel for the `value accessor` error message see http://stackoverflow.com/questions/37202543/ngmodel-binding-on-polymer-dropdown-angular2 – Günter Zöchbauer May 14 '16 at 17:27
1

@mayur that's quite weird that this works. This `ngFor` syntax is supposed to only work on ` – Günter Zöchbauer May 14 '16 at 17:28

score 0 · Answer 2 · answered May 14 '16 at 04:30

0

You can try : *ngFor="#country of countries"

answered May 14 '16 at 04:30

user3718021

1

1

I don't think this syntax is used anymore. I get "No provider for e! (e -> e)" error. – Jonas Arcangel May 14 '16 at 06:21

Angular2 Template parse errors: Property binding ngFor not used by any directive on an embedded template

2 Answers2

Linked