File tree Expand file tree Collapse file tree 1 file changed +27
-0
lines changed
Expand file tree Collapse file tree 1 file changed +27
-0
lines changed Original file line number Diff line number Diff line change @@ -105,6 +105,33 @@ Output:
105105
106106<img src =" https://material.angularjs.org/material2_assets/list/dense-list.png " >
107107
108+ ### Lists with multiple sections
109+
110+ You can add a subheader to a list by annotating a heading tag with an ` md-subheader ` attribute. To add a divider,
111+ use ` <md-divider> ` tags.
112+
113+ ``` html
114+ <md-list >
115+ <h3 md-subheader >Folders</h3 >
116+ <md-list-item *ngFor =" #folder of folders" >
117+ <i md-list-avatar class =" material-icons" >folder</i >
118+ <h4 md-line >{{folder.name}}</h4 >
119+ <p md-line class =" demo-secondary-text" > {{folder.updated}} </p >
120+ </md-list-item >
121+ <md-divider ></md-divider >
122+ <h3 md-subheader >Notes</h3 >
123+ <md-list-item *ngFor =" #note of notes" >
124+ <i md-list-avatar class =" material-icons" >note</i >
125+ <h4 md-line >{{note.name}}</h4 >
126+ <p md-line class =" demo-secondary-text" > {{note.updated}} </p >
127+ </md-list-item >
128+ </md-list >
129+ ```
130+
131+ Output:
132+
133+ <img src =" https://material.angularjs.org/material2_assets/list/subheader-list.png " >
134+
108135### Lists with secondary text
109136Secondary text styling will be part of a broader typography module to
110137[ come later] ( https://github.com/angular/material2/issues/205 ) , and won’t be implemented as part of this component
You can’t perform that action at this time.
0 commit comments