Nested md-grid-list in angular2/material

1,824 views
Skip to first unread message

Alex Friedman

unread,
Jan 24, 2017, 6:19:48 PM1/24/17
to angular-material2
Is it possible to have a nested md-grid-list using angular2/material?  See a sample below, second grid list never gets drawn inside the first one.  Any help very appreciated.

<md-grid-list flex cols="1" rowHeight="4:3">
    <md-grid-tile [style.background]="'lightgreen'">
        <md-grid-tile-header>
            <h3>Hello</h3>
        </md-grid-tile-header>
        <md-grid-list flex cols="2" rowHeight="300px">
            <md-grid-tile *ngFor="let item of items;" [style.background]="'lightpink'">
                Hello{{i}}
            </md-grid-tile>
        </md-grid-list>
    </md-grid-tile>
</md-grid-list

mar...@fodi.se

unread,
Feb 7, 2017, 5:43:58 AM2/7/17
to angular-material2
Perhaps you can explain what you need to achieve?

Alex Friedman

unread,
Feb 7, 2017, 1:33:20 PM2/7/17
to angular-material2
Looking to achive, something like http://plnkr.co/edit/ZcpLQDQciOGzuQMh4GnM?p=preview

mar...@fodi.se

unread,
Feb 7, 2017, 3:32:03 PM2/7/17
to angular-material2
But why do you want to nest the grid list component?
What kind of layout are you expecting?

I guess you can get a similar layout by just using divs inside a tile?

Himanshu Bansal

unread,
Nov 25, 2017, 5:31:04 AM11/25/17
to angular-material2
I guess you can get a similar layout by just using divs inside a tile?

we can get the grid layout too with using div.. there is no need to use material grid layout lol... 

Its obviously, that he is trying to use the predefined layout to get a nested structure where he don't have to write whole layout again... 

What kind of layout are you expecting?

 Probably he is expecting something like bootstrap.css thing.. where you can nested layout.
Reply all
Reply to author
Forward
0 new messages