角材摺疊卡

Question

有沒有辦法使用角材製作摺疊卡？看起來像一些相當受歡迎的東西，但我一直在尋找適當的角度材料組件/設置在這裏：Angular Material - Card，什麼都沒發現。

謝謝！

Answer 1

像Will提到的那樣，只需使用擴展面板即可。否則，只需創建一個普通的Angular Material卡片並使用[hidden]質量或一些CSS（display：none）實現自己的收縮機制。您可以利用* ngIf和按鈕事件來創建您自己的可摺疊卡。不應該需要太多的代碼。

事情是這樣的：

<md-card> 
    <md-card-header> 
    <div md-card-avatar class="example-header-image"></div> 
    <md-card-title>My title</md-card-title> 
    </md-card-header> 

    <md-card-content *ngIf="!collapsed"> 
    <p>My text</p> 
    </md-card-content> 
    <md-card-actions> 
    <button md-button (click)="collapsed=true">COLLAPSE ME</button> 
    <button md-button (click)="collapsed=false">UNCOLLAPSE ME</button> 
    </md-card-actions> 
</md-card>