template tag index for angular angular2-template primeng

tag - ngfor index angular 6



¿Qué es let-*en las plantillas de Angular 2? (1)

actualizar Angular 5

ngOutletContext fue renombrado a ngTemplateOutletContext

Ver también https://github.com/angular/angular/blob/master/CHANGELOG.md#500-beta5-2017-08-29

original

Las plantillas ( <template> o <ng-template> desde 4.x) se agregan como vistas incrustadas y se les pasa un contexto.

Con let-col la propiedad de contexto $implicit está disponible como col dentro de la plantilla para enlaces. Con let-foo="bar" la bar propiedades de contexto está disponible como foo .

Por ejemplo, si agrega una plantilla

<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>

Vea también esta respuesta y ViewContainerRef#createEmbeddedView .

*ngFor también funciona de esta manera. La sintaxis canónica lo hace más obvio.

<ng-template let-item [ngForOf]="items" let-i="index" let-odd="odd"> <div>{{item}} </ng-template>

donde NgFor agrega la plantilla como vista incrustada al DOM para cada item de items y agrega algunos valores ( item , index , odd ) al contexto.

Consulte también Uso de $ implict para pasar múltiples parámetros

Encontré una sintaxis de asignación extraña dentro de una plantilla Angular 2.

<template let-col let-car="rowData" pTemplate="body"> <span [style.color]="car[col.field]">{{car[col.field]}}</span> </template>

Parece que let-col y let-car="rowData" crean dos nuevas variables col y car que luego pueden vincularse dentro de la plantilla.

Fuente: https://www.primefaces.org/primeng/#/datatable/templating

¿Cómo se llama esta sintaxis mágica let-* ?

¿Como funciona?

¿Cuál es la diferencia entre let-something y let-something="something else" ?