teradata 共价 td-menu-header

Question

我一直在查看 https://teradata.github.io/covalent/ 上提供的所有文档，但我没有在 Teradata Covalent Quickstart 中找到任何关于 "td-menu-header" 的文档。

这个 css 框架看起来很有趣，但是缺少文档 - "API" 文档或开发人员指南会很棒 - 让我们面临艰难的选择。

Answer 1

我就这样用过。代码示例存在于 Teradata 快速入门项目中。

<button md-icon-button mdTooltip="Profile" [mdMenuTriggerFor]="profileMenu"><md-icon class="md-24">person</md-icon></button>
    <md-menu #profileMenu="mdMenu">
        <td-menu>
            <div td-menu-header class="md-subhead">Profile</div>
            <div flex>
                <md-list dense>
                    <!--<h3 md-subheader>Metadata</h3>-->
                    <md-list-item>
                        <md-icon md-list-avatar>location_on</md-icon>
                        <h2 md-line *ngIf='client.address!==""'><span class="text-wrap">{{client.address}}</span></h2>
                        <h2 md-line *ngIf='client.address===""'>--</h2>
                        <p md-line>Address</p>
                    </md-list-item>
                    <md-divider md-inset></md-divider>
                    <md-list-item>
                        <md-icon md-list-avatar>location_city</md-icon>
                        <h2 md-line>{{client.city}}, {{client.state}}-{{client.zip}}</h2>
                        <p md-line>City,State-Zip</p>
                    </md-list-item>
                    <md-divider md-inset></md-divider>
                    <md-list-item>
                        <md-icon md-list-avatar>flag</md-icon>
                        <h2 md-line>{{client.country}}</h2>
                        <p md-line>Country</p>
                    </md-list-item>
                    <md-list-item>
                        <md-icon md-list-avatar>call</md-icon>
                        <h2 md-line>{{client.phone}}</h2>
                        <p md-line>Primary Phone</p>
                    </md-list-item>
                    <md-divider md-inset></md-divider>
                    <md-list-item *ngIf='client.phone2!==""'>
                        <md-icon md-list-avatar>call</md-icon>
                        <h2 md-line>{{client.phone2}}</h2>
                        <p md-line>Secondary Phone</p>
                    </md-list-item>
                    <md-divider md-inset *ngIf='client.phone2!==""'></md-divider>
                    <md-list-item>
                        <md-icon md-list-avatar>email</md-icon>
                        <h1 md-line><span class="text-wrap">{{client.email}}</span></h1>
                        <!--<h1 md-line></h1>-->
                        <p md-line>Primary Email {{client.email2}}
                        </p>
                    </md-list-item>
                    <md-divider md-inset></md-divider>
                    <md-list-item *ngIf='client.email2!==""'>
                        <md-icon md-list-avatar>email</md-icon>
                        <h1 md-line><span class="text-wrap">{{client.email2}}</span></h1>
                        <!--<h1 md-line></h1>-->
                        <p md-line>Secondary Email
                        </p>
                    </md-list-item>
                    <md-divider md-inset *ngIf='client.email2!==""'></md-divider>
                    <md-list-item>
                        <md-icon md-list-avatar>print</md-icon>
                        <h2 md-line *ngIf='client.fax!==""'>{{client.fax}}</h2>
                        <h2 md-line *ngIf='client.fax===""'>--</h2>
                        <p md-line>Fax</p>
                    </md-list-item>
                </md-list>
            </div>
        </td-menu>
    </md-menu>

teradata 共价 td-menu-header

teradata covalent td-menu-header

material-design

teradata-covalent