Using ng-for in the following code produces an error on the JavaScript Console of the browser when executed. The error is: An error occurred loading file: package:pe2/show_properties.ng_deps.dart
library pe.show_properties;
import 'package:angular2/angular2.dart';
import 'package:pe2/friends_service.dart';
@Component(selector: 'display', viewProviders: const [FriendsService])
@View(template: '''
<p>My name: {{ myName }}</p>
<p>Friends:</p>
<ul>
<li *ng-for="#name of friendNames">
{{ name }}
</li>
</ul>
<p *ng-if="friendNames.length > 3">You have many friends!</p>
''', directives: const [NgFor, NgIf])
class DisplayComponent {
String myName = 'Alice';
List<String> friendNames;
DisplayComponent(FriendsService friendsService) {
friendNames = friendsService.names;
}
}
library pe2.friends_service;
import 'package:angular2/angular2.dart';
@Injectable()
class FriendsService {
List<String> names = ['Aarav', 'Martín', 'Shannon', 'Ariana', 'Kai'];
}