角材料-md格列表内容

角材料-md格列表内容

问题描述:

我试图用我现在所面临的角度material.The问题的md-grid-tilemd-grid-tile内容对齐center.How使从开始角材料-md格列表内容

<md-content layout-padding> 

     <md-grid-list md-cols="6" 
      md-row-height-gt-md="1:1" md-row-height="4:3" md-gutter-gt-md="16px" 
      md-gutter-gt-sm="8px" md-gutter="4px"> 
        <md-grid-tile 
        ng-repeat="room in floorDetails.roomDetails" 
        ng-style="{'background': '#f2f2f2'}" 
        md-colspan-gt-sm="3" 
        md-rowspan-gt-sm="2"> 



           <div layout="row" layout-align="center center"> 
           <b >Room1</b> 
           </div> 
           <div class='md-padding' layout="row" layout-wrap> 
             <md-card class="md-card" ng-repeat="bed in room.bedIds"> 
              <md-card-content> 

              </md-card-content> 
             </md-card> 
            </div> 
          </div> 
       </md-grid-tile>   
     </md-grid-list> 

它工作当前捕捉

Current snap

期望捕捉

desired snap

试着下次提供一个codepen/plunkr的例子,如果人们有示例代码可以玩,他们更倾向于帮助你。你应该阅读angular-material layout。您主要是在md-grid-tile内丢失了一个<div layout="column" layout-fill>容器。 layout-fill使容器填充整个瓷砖。

然后,您可以使用固定的css尺寸调整卡片的尺寸或将它们弯曲。该示例水平弯曲它们可能不是所期望的。

codepen

+0

非常感谢您 –

+0

似乎不工作(还)有角2材料设计位 – CalvinDale