CODEWITHSUNDEEP
dartangularangular-dart
S Wheeler
S Wheeler

Reputation: 137

Dart implementation of Angular 2 directive ngFor generating error

The following compile time error is generated when trying to use the ngFor directive in the Dart implementation of Angular 2 Beta 0.

Property binding ngForOf not used by any directive on an embedded  template ("[ERROR ->]
<div *ngFor="#item of items">
{{item}}
</div>"):

Component: 

library design;

import 'package:angular2/angular2.dart';

@Component(
    selector: 'design-component',
    templateUrl: 'design.html',
    viewProviders: const [CORE_DIRECTIVES]
)
class DesignComponent {
   List<String> items = ["One", "Two", "Three"];
}

Template: 

<div *ngFor="#item of items">
   {{item}}
</div>

Any suggestions or help would be appreciated.

Upvotes: 4

Views: 632

Answers (2)

mauricio777
mauricio777

Reputation: 1436

What worked for me was changing:

<li *ng-for="#name of friendNames">

To:

<li *ngFor="#name of friendNames">

In my template.

Here is my Component:

@Component(selector: "app",
           directives: const [NgFor],
           templateUrl: 'app_component.html')
class AppComponent{
    List<String> friendNames = const ["a", "b", "c"];
}

Gunther Zochbauer mentions this in comment to his answer.

Upvotes: 0

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657038

viewProviders should be directives. viewProviders are for dependency injection.

Upvotes: 4

Related Questions