如何在角材料中设置列的大小？

Question

是否可以设置layout="column"的宽度？我发现只有flex适用于layout="row"，我想进行以下设计：  具有行对的列，我可以在其中设置整个父列的宽度：

Answer 1

这是你的意思吗？ Plunker

当你说

时

  

设置layout =＆＃34;列＆＃34;

的宽度

我认为您的意思是设置布局=＆＃34;行＆＃34; 的宽度。行宽定义了列的宽度，这可能有点令人困惑但是有意义。

标记

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp" style="width:100%; height:100%; padding:50px" layout="row">
  <div style="border:red 5px solid; overflow:auto" flex="50">
    <div ng-repeat="item in items" layout="row" flex>
      <div style="background:darkred; height:50px; margin:10px" flex></div>
      <div style="background:blue; height:50px; margin:10px" flex></div>
    </div>
  </div>
  <div style="border:red 5px solid; overflow:auto; margin-left:50px" flex="20">
    <div ng-repeat="item in items" layout="row" flex>
      <div style="background:darkred; height:50px; margin:10px" flex></div>
      <div style="background:blue; height:50px; margin:10px" flex></div>
    </div>
  </div>
</div>

JS

angular.module('MyApp',['ngMaterial'])
.controller('AppCtrl', function($scope) {
  $scope.items = [0, 1, 2, 3, 4 ,5 ,6, 7, 8, 9];
});