Angulaire de la Carte de Matériel de remplissage hauteur de parent

Je suis à essayer de comprendre comment définir la hauteur d'un md-carte à remplir son parent.
Voici mon exemple:

<div ng-controller="AppCtrl" ng-app="MyApp">
  <div layout="column" layout-gt-sm="row" layout-padding="layout-padding" layout-fill="layout-fill">

    <div flex="flex" flex-gt-sm="33" layout="column" layout-fill="layout-fill">
      <div flex="flex" layout="row">
        <md-content flex="flex">
          <md-card>
            <md-card-content><span>can I please be as high as the other two cards together</span></md-card-content>
          </md-card>
        </md-content>
      </div>
    </div>

    <div flex="flex" flex-gt-sm="33" layout="column">
      <md-card flex="flex">
        <md-card-content>
          <p>some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content </p>
        </md-card-content>
        <div layout="column" layout-gt-sm="row" class="md-actions">
          <md-button flex="flex" ng-click="asdf()">asdf
            <md-tooltip>asdf</md-tooltip>
          </md-button>
          <md-button flex="flex" ng-click="qqqqqqqq();">qqqqqqqq
            <md-tooltip>qqqqqqqq</md-tooltip>
          </md-button>
        </div>
      </md-card>
      <md-card flex="flex">
        <md-card-content>
          <div layout="column">
            <p>some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content some very long content </p>
        </md-card-content>
      </md-card>
    </div>

  </div>
</div>

http://codepen.io/anon/pen/BNPBwJ

Peut aider quelqu'un ?

OriginalL'auteur IHeartAndroid | 2015-07-16

  1. 7

    Vous semblent un peu plus compliquées. Il fonctionne lorsque vous simplifier les choses comme ceci:

    <md-content layout="row" flex>
  <md-card flex="33">
    <md-card-content><span>can I please be as high as the other two cards together</span></md-card-content>
  </md-card>
    ...

    au lieu de

    <div flex="flex" flex-gt-sm="33" layout="column" layout-fill="layout-fill">
  <div flex="flex" layout="row">
    <md-content flex="flex">
      <md-card>
        <md-card-content><span>can I please be as high as the other two cards together</span></md-card-content>
      </md-card>
    </md-content>
  </div>
</div>

    Dans mon code j'ai aussi ajouté une classe à md-content pour régler la hauteur en particulier, et les cartes de remplir l'espace à partir de là.

    Comme angulaire matériel 2.0.0-bêta.6, md-contenu n'existe plus. Comment puis-je avoir le même comportement qu'avec cette version? (Je suis à l'aide d'un md-grille-liste)

    OriginalL'auteur srukali

  2. 1

    Je suis nouveau sur Angulaire du Matériel, donc je n'ai pas de réponse. Ce que je peux vous dire, c'est que j'ai appliqué certains style="background-color: red; padding: 5px;" les éléments et, en bas de md-contenu, ces éléments sont tous de mise en page-rempli.

    J'ai aussi remarqué que le md-carte de la hauteur est héritée de corps et de 100%.

    Cela dit, ça ne fonctionnera que si vous perdez le md-contenu de la directive. Je suis désolé, je ne peux pas expliquer pourquoi, et je pouvais aussi utiliser l'aide à la compréhension de ce comportement.

    Angulaire de la Carte de Matériel de remplissage hauteur de parent

    OriginalL'auteur Igor Donin