角材レイアウトの動作....兄弟動作の問題

Question

私はAngular Materials Layout Containerを読んでいます。 「レイアウト指令」の例では、コードが存在します。

<div layout="row"> 
    <div flex>First item in row</div> 
    <div flex>Second item in row</div> 
</div> 
<div layout="column"> 
    <div flex>First item in column</div> 
    <div flex>Second item in column</div> 
</div> 

私には意味がありませんどのような最初の<div layout="row">が行のみではなく、行全体の50％にまたがるということです。行の半分は兄弟と共有されています。

は<div layout="row">の兄弟であるため、<div layout="row">には含まれません。

の動作は、それがそうでない場合（それは兄弟である）、<div layout="row">の子であるかのように私に混乱しています。

誰でもこれを明確にすることはできますか？これはエラーですか？

Answer 1

これら2つのdiv要素の親に依存まあ、親のレイアウトが宣言されていない場合、それはそのに行を前提としています

<div> 
    <div layout="row"> 
     <div flex>First item in row</div> 
     <div flex>Second item in row</div> 
    </div> 
    <div layout="column"> 
     <div flex>First item in column</div> 
     <div flex>Second item in column</div> 
    </div> 
</div> 

あなたは別のを望むのであれば、デフォルトのレイアウトを変更する必要があります行動：

<div layout="column"> 
    <div layout="row"> 
     <div flex>First item in row</div> 
     <div flex>Second item in row</div> 
    </div> 
    <div layout="column"> 
     <div flex>First item in column</div> 
     <div flex>Second item in column</div> 
    </div> 
</div>