0
<md-content flex class="md-padding page-content">
<div ui-view flex layout="column">
<div class="center" layout="row" flex>
<md-content layout="column" flex="30">
<md-list-item ng-repeat="entity in vm.entities">
<md-checkbox ng-model="entity.selected"></md-checkbox>
<p>{{entity.info}}</p>
<md-icon class="md-secondary"
ng-click="doSecondaryAction($event)" aria-label="Chat">message</md-icon>
</md-list-item>
</md-content>
<md-divider></md-divider>
<md-content layout="column" flex="70">
Details here!
</md-content>
</div>
</div>
</md-content>
在我上面的代碼中,最外面的md-content佔據了整個頁面;然而,使用ui-view gived列布局和flex類時,我預計它會佔用頁面的整個高度,但佔用僅由內容消耗的高度。md-content不消耗父元素的全部高度
你能幫忙解決一下代碼中的錯誤嗎,這樣ui-view可以佔據整個頁面嗎?
嘿@camden_kid感謝您的回答。但是,我試圖實現的是左側列表和右側詳細面板的單獨滾動/填充。就像在你的codepen中一樣,兩者都是相同的高度。有沒有辦法讓列表達到全高而不管列表中的元素(垂直分隔符是全高),並且兩個部分都有單獨的卷軸。 – user1242321
@ user1242321查看已更新的CodePen。你是這個意思嗎? –
我看不到列表部分中的滾動....我的問題是假設列表中有100個項目...所以只有列表部分應該滾動...而細節部分保持靜止! – user1242321