Angular 结构指令不能绑定属性名
我在一本书中尝试了一个教程,得到了一个错误:“无法从html中读取未定义的属性'name' 以下是iterator.directive.ts中的代码:Angular 结构指令不能绑定属性名,angular,angular2-directives,Angular,Angular2 Directives,我在一本书中尝试了一个教程,得到了一个错误:“无法从html中读取未定义的属性'name' 以下是iterator.directive.ts中的代码: import { Directive, Input, TemplateRef, ViewContainerRef } from "@angular/core"; @Directive({ selector: '[paForOf]' }) export class PaItera
import { Directive, Input, TemplateRef, ViewContainerRef } from "@angular/core";
@Directive({
selector: '[paForOf]'
})
export class PaIteratorDirective {
constructor(private container: ViewContainerRef,
private template: TemplateRef<Object>) {}
@Input('paForOf')
dataSource:any;
ngOnInit() {
this.container.clear();
for (let i=0; i < this.dataSource.length; i++) {
this.container.createEmbeddedView(this.template,
new PaIteratorContext(this.dataSource[i]));
}
}
}
class PaIteratorContext {
constructor(public $implict: any) {}
}
以下是html:
<div class="row m-2">
<div class="checkbox">
<label>
<input type="checkbox" [(ngModel)]="showTable" />
Show Table
</label>
</div>
<table *paIf="showTable" class="table table-sm table-bordered table-striped">
<thead>
<th></th>
<th>Name</th>
<th>Category</th>
<th>Price</th>
</thead>
<tbody>
<ng-template [paForOf]="getProducts()" let-item>
<tr>
<td colspan="4">
{{item.name}}
</td>
</tr>
</ng-template>
</tbody>
</table>
</div>
错误发生在{{item.name}上
以下是我所做的分析:
在控制台中,在iterator.directive.ts行上,对于let i=0;iclass PaIteratorContext {
constructor(public $implict: any) {}
^^^^^^^^
}
应该是$implicit这很烦人,但就像你说的那样。。