I have been (and still a bit) confused about the case of angular 2’s directives … is it *ngFor or *ng-for … ie camel case or dash case? I’ve always used dash case in the alpha’s of Angular 2. However, the docs suggests camel case … but then the working example in this doc suggests dash case …
I decided to do a test rig myself on the latest version of Angular 2 (beta 0) …

camelCase

The following component works fine:

import { Component } from "angular2/core";

@Component({
  selector: "my-app",
  template: '<div *ngFor="#person of people">{{person.name}}</div>'
})
export class AppComponent {
  public people = [
    { id: 11, name: "John Smith" },
    { id: 12, name: "Fred Jones" },
    { id: 13, name: "Bob Peters" }
  ];
}

dash-case

However, the following component errors:

import { Component } from "angular2/core";

@Component({
  selector: "my-app",
  template: '<div *ng-for="#person of people">{{person.name}}</div>'
})
export class AppComponent {
  public people = [
    { id: 11, name: "John Smith" },
    { id: 12, name: "Fred Jones" },
    { id: 13, name: "Bob Peters" }
  ];
}

You get: Template parse errors: Can’t bind to ‘ng-forOf’ since it isn’t a known native property

So, it looks like we’re using camel case now in Angular 2 beta but the live examples still need to catch up …

#angular #directive case #camelcase #dash-case