使用 AngularDart 组件打开列表中的展开项目

Open an expanded item in a list with AngularDart component

已使用 MaterialListComponentMaterialListItemComponent 组件在 AngularDart 应用程序中制作列表。

When one item of type MaterialListItemComponent is selected, I would like a behaviour similar to first ExpansionPanel example of the AngularDart Gallery. 打开展开的项目。但是对于这个组件,我没有找到一种方法可以在它关闭时放置更多信息,例如图像(头像),更多标签,按钮。

这里是另一个例子,Google 收件箱 邮件:

已关闭列表项:

列表中的一项已打开并展开:

我想实现这个。

有什么方法或建议可以使用 AngularDart 组件来实现吗?

MaterialExpansionPanel允许几个ng-content区域配置header区域。

[名称]、[值] 和 [操作] 区域。

在这种情况下,听起来您想使用操作内容区域。它仅在内容关闭时显示。您可以在 Edit/Duplicate 示例 here 中看到这一点。它隐藏了 header,但您不需要。