md-card內的md-switch/md-button

Question

我想在md-card內顯示md-switch和md-button。我能夠在正確的位置顯示md卡內的文本，但連接到該文本的開關顯示在其他某個位置。

卡片顯示給用戶懸停在某些內容上。

DemoCode.html

<md-card> 
     <md-card-header> 
      <md-card-header-text> 
       Sample 1 
      </md-card-header-text> 
     </md-card-header> 
     <md-card-content> 
     </md-card-content> 
     <md-card-actions> 
       <md-switch ng-model="data.cb2" aria-label="Switch" ng-true-value="'true'" ng-false-value="'false'"> 
        {{ data.cb2 }} 
       </md-switch> 
     </md-card-actions> 
    </md-card>  

Answer 1

我不知道我跟着你的問題標題和問題內容，​​但這裏的元素放在一個卡內的一個例子 - CodePen

如果這不是正是你需要在編輯中進一步解釋。

標記

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp"> 
    <md-card> 
    <md-card-header layout="row"> 
     <md-card-header-text> 
     Sample 1 
     </md-card-header-text> 
    </md-card-header> 
    <md-card-content> 
    </md-card-content> 
    <md-card-actions layout="row" layout-align="start center"> 
     <label>My Switch</label> 
     <md-switch ng-model="data.cb2" aria-label="Switch" ng-true-value="'true'" ng-false-value="'false'"> 
     {{ data.cb2 }} 
     </md-switch> 
     <md-button class="md-raised">Hello</md-button> 
    </md-card-actions> 
    </md-card> 
</div>