我在Angular 2模板中遇到了一个奇怪的赋值语法.
<template let-col let-car="rowData" pTemplate="body">
<span [style.color]="car[col.field]">{{car[col.field]}}</span>
</template>
似乎let-col和let-car="rowData"创建了两个新变量col和car，然后可以将它们绑定到模板内部.
资料来源:https://www.primefaces.org/primeng/#/datatable/templating
这个神奇的let-*语法叫什么？
它是如何工作的？
let-something和let-something="something else"有什么区别？
update Angular 5
ngOutletContext更名为ngTemplateOutletContext
另见第CHANGELOG.md @ angular/angular页
original
模板(从4.x开始为<template>或<ng-template>)作为嵌入式视图添加，并传递给上下文.
在let-col的情况下，上下文属性$implicit在用于绑定的模板内作为col可用.
利用let-foo="bar"，使上下文属性bar作为foo可用.
例如，如果您添加一个模板
<ng-template #myTemplate let-col let-foo="bar">
<div>{{col}}</div>
<div>{{foo}}</div>
</ng-template>
<!-- render above template with a custom context -->
<ng-template [ngTemplateOutlet]="myTemplate"
[ngTemplateOutletContext]="{
$implicit: 'some col value',
bar: 'some bar value'
}"
></ng-template>
另请参见this answer和ViewContainerRef#createEmbeddedView.
*ngFor也是这样.规范语法使这一点更加明显
<ng-template ngFor let-item [ngForOf]="items" let-i="index" let-odd="odd">
<div>{{item}}</div>
</ng-template>
其中，NgFor将模板作为嵌入视图添加到DOM中，用于items中的每item个，并向上下文添加一些值(item、index、odd).