在鼠标悬停时展开材料扩展面板

时间:2018-04-25 08:01:19

标签: html css angular typescript angular-material

我的应用程序中有一个材质扩展面板。当您将鼠标悬停在面板上时,我想展开面板,如果再次离开,我想自动折叠。这可以在my.css文件中实现吗?或者我必须在我的打字稿中这样做以及如何做?

这是我的html

    <mat-expansion-panel class="expansion-panel-class">
<mat-expansion-panel-header>
....
</mat-expansion-panel-header>
<mat-list>
<!-- my elements -->
</mat-list>
</mat-expansion-panel>

和我的css

.expansion-panel-class{
    /*Expansion panel is collapsed*/
}

.expansion-panel-class :hover{
    /*Expansion panel is expanded*/
}

提前致谢!

1 个答案:

答案 0 :(得分:7)

两者都没有,您可以将其添加到HTML模板中。事实上,Angualr团队推荐的(将视图逻辑保存到模板中)。

只需使用局部变量和事件绑定。

./adb connect 192.168.XXX.XXX