只在横向模式下应用布局填充角材料

我在md内容中有两个div，我只想在横向模式下为第一个div应用布局填充。有没有办法来处理它。只在横向模式下应用布局填充角材料

<md-content layout-fill layout="column" flex > 
     <div flex="45" id="c1" layout layout-align="center center"> 
     <div> 
      <img src="http://www.hdicon.com/wp-content/uploads/2014/07/visa_2014-100x100.png" width="100" height="100"><br> 
      <span>Label</span> 
     </div> 
     </div> 
     <div flex="55" id="c2" layout layout-align="center center"> 
     <div> 
      <md-input-container class="md-block"> 
      <label>First name</label> 
      <input name="name" ng-model="user.name" required>        
      </md-input-container> 
     </div> 
     </div>  
    </md-content>

http://codepen.io/ankamsarav/pen/KzrPNX

来源

2016-04-30 ankam sarav

我不知道的方式有条件地适用该指令。要解决此问题，您可以改为使用两个<md-content></md-content>指令并使用ng-if来切换它们，以便一次只将一个呈现到DOM中。

<md-content layout-fill ng-if="landscapeBoolean">...</md-content> 
<md-content ng-if="!landscapeBoolean">...</md-content>

然后，您可以侦听方向更改事件并相应地切换布尔值。

来源

2016-05-01 16:37:48

感谢您的回复，但我们必须复制整个内容的一个属性:( –

是的，它不是最令人满意的解决方案，但我认为没有更好的方法。您可以为内部内容定义指令，所以不需要太多的重复。由于ng-if只在满足if条件时呈现，所以该指令只会在页面加载时呈现一次。 –

只在横向模式下应用布局填充角材料

回答

相关问题