停止嵌套的涟漪效应

Question

我正在使用Angular Materia 0.10.1。

我在md-button内嵌套md-list-item。这两个元素在单击时会触发涟漪效应，当我单击该按钮时，它会同时触发两个元素上的涟漪效应。我希望按钮或列表元素仅上有涟漪，但不能同时出现两者。

<md-list flex>
    <md-list-item ng-click="a('a')">
      <p>Some name</p>
      <md-button class="md-accent md-raised" ng-click="b('b', $event)">Do something</md-button>
    </md-list-item>
 </md-list>

我已经使用了$event.stopPropagation()，但它并没有像停止嵌套点击事件那样停止涟漪。

This Plunker可以更好地展示它。

Answer 1

它似乎是md-primary类中内置的内容以及它如何与列表项一起使用。如果你看一下这些例子，有一些侧面按钮没有表现出这种行为

只需将按钮上的班级交换到md-secondary，它似乎可以解决您的问题（虽然造型现在是另外一个）

 <md-button class="md-secondary md-raised" ng-click="b('b')">Do something</md-button>

http://plnkr.co/edit/4fo8u190gpKyoHznVbFM?p=preview

或者，该示例使用md-icon而不是按钮，这似乎也有效。