角度材质中的嵌套列表

时间:2018-04-27 21:51:57

标签: angular angular-material2

你可以在Angular Material中嵌套列表吗?

我没有看到任何examples in the documentation

我猜我应该使用multiline list,但我做错了。

Things that I have tried.

2 个答案:

答案 0 :(得分:9)

正如评论中的@Vega所示,您无法在<mat-list>下嵌套<mat-list-item>,但如果您想要另一个包含它们的div,那么它仍然可以,并且<mat-list>行高是正确的。

以下是@Vega的示例:https://stackblitz.com/edit/angular-nnkg3h-xppmzz

<mat-list>
    <ng-container *ngFor="let item of items">
        <mat-list-item>{{item.name}}</mat-list-item>
        <mat-list style="margin-left:30px;">
            <div *ngFor="let subItem of item.subItems">
                <mat-list-item>{{ subItem.name }}</mat-list-item>
            </div>
        </mat-list>
    </ng-container>
</mat-list>

答案 1 :(得分:0)

现在有一个 Angular Material“树”组件,它基本上是一个类似于文件结构的嵌套列表的列表。如果这是您要找的,您可以在这里找到它:https://material.angular.io/components/tree/overview