angularjs - AngularJS - ng-switch 没有按预期工作

Question

我正在使用 AngularJS 和 twitter 引导程序。我的问题的小提琴可以在这里找到。

这里有问题的 HTML 代码是：

<button type="button" class="btn" ng-repeat="tool in toolBar">
    <div ng-switch on="tool.action">
        <i class="icon-plus-sign" ng-switch="insert"></i>
        <i class="icon-edit" ng-switch-when="edit"></i>
        <i class="icon-trash" ng-switch-when="delete"></i>
    </div>
</button>

范围是：

$scope.toolBar = [
    {
        "action": "insert"
    },
    {
        "action": "edit"
    },
    {
        "action": "delete"
    }        
];

问题是我希望每个按钮只显示一个图标，但不知何故显示了两个以上的图标。

我究竟做错了什么？

Answer 1

您缺少一个when.

将您的 html 替换为

<button type="button" class="btn" ng-repeat="tool in toolBar">
    <div ng-switch on="tool.action">
        <i class="icon-plus-sign" ng-switch-when="insert"></i>
        <i class="icon-edit" ng-switch-when="edit"></i>
        <i class="icon-trash" ng-switch-when="delete"></i>
    </div>
</button>

它应该可以正常工作。