javascript - angular2 let-entity 指令

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

让您了解 Angular 处理方式的最佳建议 <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>";
}