我创建了一个超级基础项目使用最新的阶段来验证这一点。* ngFor未在镖角(4)
的pubspec看起来是这样的:
name: angular4_basic
description: A web app that uses AngularDart Components
version: 0.0.1
#homepage: https://www.example.com
#author: Rick Berger <[email protected]>
environment:
sdk: '>=1.24.0 <2.0.0'
dependencies:
angular: ^4.0.0
angular_components: ^0.6.0
dev_dependencies:
browser: ^0.10.0
dart_to_js_script_rewriter: ^1.0.1
transformers:
- angular:
entry_points:
- web/main.dart
- dart_to_js_script_rewriter
这里是main.dart:
import 'package:angular/angular.dart';
import 'package:angular4_basic/app_component.dart';
void main() {
bootstrap(AppComponent);
}
的app_component.html看起来是这样的:
<h1>The Beatles</h1>
<ul>
<li *ngFor="let name of names">{{name}}</li>
</ul>
而且app_component.dart看起来像这样:
import 'package:angular/angular.dart';
import 'package:angular_components/angular_components.dart';
@Component(
selector: 'my-app',
styleUrls: const ['app_component.css'],
templateUrl: 'app_component.html',
directives: const [materialDirectives],
providers: const [materialProviders],
)
class AppComponent {
List<String> names = <String>['George', 'Paul', 'Ringo', 'John'];
}
我收到以下错误:
*ngFor="let name of names"
^^^^^^^^^^^^^^^^^^^^^^^^^^
line 4, column 3 of AppComponent: ParseErrorLevel.FATAL: Property binding ngForOf not used by any directive on an embedded template
<li *ngFor="let name of names">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
...其次是大长堆栈跟踪
事情我试过
更换 '* ngFor' 与'< ng-template ngFor ....> </ng-template>'语法 - 创建了一个未解决的问题。
使用dartdevc编译
所以,我错过什么,在这里?
如果你什么'* ngFor = “让名字的名字”',每[文件](HTTPS://webdev.dartlang .ORG /角度/导向/显示数据#!#表示-A-列表属性与 - ngfor)?那么根模块是什么样子? – jonrsharpe
Dangit。我的不好,但不是,那不能解决它。 '根模块',你的意思是'main.dart'?我将它添加到原始文章(并修复了'let'kw。) – rickb
将NgFor添加到指令列表时会发生什么? IIRC不再有任何魔术COMMON_DIRECTIVES,你必须包括NgFor,NgIf你自己。 –