小编riy*_*uyu的帖子

(Angular 2+)在*ngFor中使用ng-content,无法访问循环变量

如何将/ transllude/project转换为循环内的插槽,并使投影内容能够访问循环变量?

假设我有一个带有以下内容的基本组件

<tr *ngFor="let data of items">
    <td>{{data.title}}</td>
    <ng-content select="[slot]"></ng-content>
</tr>
Run Code Online (Sandbox Code Playgroud)

一个使用翻译槽"slot"的子组件

<parent [items]="items"> 
    <ng-container slot>
        <td>{{data.category}}</td>
        <td>{{data.number}}</td>
    </ng-container>
</parent>
Run Code Online (Sandbox Code Playgroud)

我想生成的HTML是

<tr>
    <td>{{data.title}}</td>
    <td>{{data.category}}</td>
    <td>{{data.number}}</td>
</tr>
Run Code Online (Sandbox Code Playgroud)

但实际发生的是"数据"未在子组件中定义,这是有道理的.有什么方法可以让它像这样工作吗?

javascript ng-template ngfor angular

9
推荐指数
1
解决办法
1926
查看次数

Javascript ES6 +命名为默认导出语法

这是有效的导出语法吗?

export default debug = {
    myfunction: myFunction
};
Run Code Online (Sandbox Code Playgroud)

javascript ecmascript-6

1
推荐指数
1
解决办法
298
查看次数

标签 统计

javascript ×2

angular ×1

ecmascript-6 ×1

ng-template ×1

ngfor ×1