Angular2 let 实体指令

Question

我创建了一个包含模板的组件：

export class TemplateParamComponent implements OnInit {
@Input() items: Array<any>;
@Input() template: TemplateRef<any>;
}

使用html：

<template #defaultTemplate let-item="item">
<strong>{{item.name}}</strong>
</template>
<ul>
<li *ngFor="let item of items">
<template [ngTemplateOutlet]="template || defaultTemplate" [ngOutletContext]="{item: item}"></template>
</li>
</ul>

我对指令 let-item 的作用感到困惑，这会创建一个名为 item 的变量吗？ let 是一个特殊的指令，允许您声明变量以在 HTML 范围内使用吗？

Answer 1

了解角度句柄<template>元素如何阅读文档的最佳建议：https://angular.io/guide/structural-directives

长话短说：将<template>视为函数(方法(，将let-something视为输入变量。所以

<template #defaultTemplate let-item="item">
<strong>{{item.name}}</strong>
</template>

可以理解为

function defaultTemplate(item: any){
return "<strong>" + item.name + "</strong>";
}