防止md-switch切換點擊線

Question

我正在使用md-switch在Angular應用程序中顯示切換。當我點擊該線路時，在任何地方，交換機都會切換。但是我已經在其他控件上使用了開關，所以我只希望它在實際開關被點擊時切換，而不是其他控件。我如何指導它行爲如此？

段：

<md-list-item class="md-1-line" ng-repeat="rule in vm.rules | filter:{name:groupedRule.name}"> 
<div style="width: 40px;">{{rule.threshold}}</div> 
<div flex> 
    <md-slider min="10" max="40" ng-model="rule.threshold"> 
    </md-slider> 
</div> 
<div style="width: 40px;"> 
    <md-switch ng-model="rule.enabled"></md-switch> 
</div>      

更新 這裏的代碼演示筆的問題：http://codepen.io/jsiegmund/pen/repwyR

更新GitHub上 問題＃7937：https://github.com/angular/material/issues/7937#issuecomment-207793522

Answer 1

你可以用div取代md-list-item - CodePen

標記

<div ng-controller="SwitchDemoCtrl" ng-app="MyApp"> 
    <md-list> 
    <div layout="row" layout-align="center center"> 
     <div style="width: 40px;"> {{ data.threshold }} </div> 
     <div flex> 
     <md-slider min="10" max="30" step="1" ng-model="data.threshold"> 
     </md-slider> 
     </div> 
     <div layout-align="end center" flex-offset="5"> 
     <md-switch ng-model="data.cb1" aria-label="Switch 1"> 
      Switch 1: {{ data.cb1 }} 
     </md-switch> 
     </div> 
    </div> 
    </md-list> 
</div>