Question

在我的对象列表中，我可以激活/激活一个对象。因此，图标会生成一个主动操作，而另一个图标会执行非活动操作，两者都在同一个md-list中。

代码：

<md-list ng-app="MyApp" class="listdemoListControls" ng-controller="ListCtrl">
  <md-list-item ng-repeat="message in messages" ng-click='actionOne("action one")'>
    <p>{{message.title}}</p>

    <md-button class="md-secondary md-icon-button" ng-if="!showActionThree" ng-click="actionTwo('action two')">
      Two // secondary action
    </md-button>

    <md-button class="md-secondary md-icon-button" ng-if="showActionThree" ng-click="actionThree('action three')">
      Three // third action
    </md-button>
 </md-list-item>
</md-list>

问题是我的actionThree函数不会触发。

当我使用md-secondary类时，他创建了一个接收我actionTwo函数的包装器，这个函数不会改变。

有没有办法使这项工作？

Related issue #3744

Answer 1

只尝试一个按钮和三元运算符，如下所示：

<md-button class="md-secondary md-icon-button" ng-click="showActionThree ? actionThree('action three') :actionTwo('action two')">
  {{showActionThree ? 'Three': 'Two'}}
</md-button>

Answer 2

由于您一次只需要一个按钮，费尔南多的回答可能是最好的。但对于其他需要多个按钮的人来说......

这应该在1.0.5中修复，但随后他们改变了他们的发布过程。您可以等待下一个稳定版本中的修复，也可以使用HEAD中的最新更改。即使在那时，我怀疑他们仍然会迫使次要行动正确对齐。

这是您可能尝试的解决方法。它使用ng-mouseover和ng-mouseout来跟踪要执行的操作：

<md-list>
  <md-list-item ng-repeat="message in messages" ng-click='rowAction(message)'>
    <p>{{message.title}}</p>

    <md-button class="md-icon-button" ng-mouseover="action='two'" ng-mouseout="action=null">
      Two
    </md-button>

    <md-button class="md-icon-button" ng-mouseover="action='three'" ng-mouseout="action=null">
      Three
    </md-button>
 </md-list-item>
</md-list>

然后在rowAction方法中，您可以执行以下操作：

$scope.rowAction = function (message){
    switch($scope.action){
        case 'two':
           $scope.actionTwo(message);
           break;
        case 'three':
           $scope.actionThree(message);
           break;
        default:
           $scope.actionOne(message);
    }
}

具有多个md-secondary动作的md-list

2 个答案: