我有以下 ngSwitch：
<p ng-switch="status">
<span ng-switch-when="wrong|incorrect">
Wrong
</span>
<span ng-switch-default>
Correct
</span>
</p>
如您所见，我有两个选项wrong 和correct 的文本Wrong。我已经尝试（如您所见）使用管道|，但这不起作用。有什么建议吗？
【问题讨论】：
status 包含值wrong 或incorrect，我想显示文本wrong。对于所有其他值，它应该显示文本 Correct
对于角度 >=v1.5.10，
您可以通过将ng-switch-when-separator="|" 添加到ng-switch-when 节点来实现。
see example in documentation.
<span ng-switch-when="wrong|incorrect" ng-switch-when-separator="|">
在这里查看讨论https://github.com/angular/angular.js/issues/3410 请注意，根据我的经验，它不适用于数字......但是？
【讨论】：
<select ng-model="myVar">
<option value="option1">Option 1
<option value="option2">Option 2
<option value="option3">Option 3
</select>
<div ng-switch="myVar">
<div ng-switch-when="option1">
<p>Option 1 is selected .</p>
</div>
<div ng-switch-when="option1">
<p>Option 2 is selected</p>
</div>
<div ng-switch-default>
<p>Option 3 is selected </p>
</div>
</div>
【讨论】：
您可以向status 添加一个过滤器，将具有相同含义的值映射到相同的值。
.filter('meaning', function() {
return function(input) {
input = input || '';
if (['wrong', 'amiss','awry', 'bad', 'erroneous', 'false', 'inaccurate',\
'misguided', 'mistaken', 'unsound', 'incorrect'].indexOf(input) != -1)
return 'wrong';
// You can make it generic like this:
synonymsDictionary = {
'someWord' : ['syn1', 'syn2', 'syn3' ... ],
'someOtherWord' : ['otherWordSyn1', 'otherWordSyn2', 'otherWordSyn3' ...]
.
.
.
};
for (var word in synonymsDictionary)
if (synonymsDictionary[word].indexOf(input) != -1)
return word; // This way you could iterate over a bunch of arrays...
// Edge case
else return input;
};
})
那你就干脆
<p ng-switch="status|meaning">
<span ng-switch-when="wrong">
Wrong
</span>
<span ng-switch-default>
Correct
</span>
</p>
尽管在您的情况下，您可能只是想打印一条消息，以便从字典中提取消息...
类似：
<span ng-if="status">
{{getStatusMessage(status)}}
</span>
【讨论】：
这不能用 Angular 的基本指令来实现，但如果你愿意，你可以编写自己的指令来实现它，并且已经可以与现有的 ngSwitch 指令接口。
ngSwitchController 有一个属性cases，它是一张地图。每个 case 键都以 ! 为前缀，默认 case 等于 ?。每个 case 值都是一个具有两个属性的对象：transclude 和 element。
警告：与 ngModelController 不同，ngSwitchController 未发布 API，因此它是可能会发生变化。
基于原始的 ngSwitchWhenDirective，我们可以构造一个 multiswitchWhen，它可以与所有现有的 ngSwitch、ngSwitchWhen 和 ngSwitchDefault 指令一起使用而不会发生冲突。
.directive('multiswitchWhen', function () {
return {
transclude: 'element',
priority: 800,
require: '^ngSwitch',
link: function(scope, element, attrs, ctrl, $transclude) {
var selectTransclude = { transclude: $transclude, element: element };
angular.forEach(attrs.multiswitchWhen.split('|'), function(switchWhen) {
ctrl.cases['!' + switchWhen] = (ctrl.cases['!' + switchWhen] || []);
ctrl.cases['!' + switchWhen].push(selectTransclude);
});
}
}
});
【讨论】：
这与使用 ng-if 几乎相同，但这样做的好处是您可以在主 ng-switch 中多次使用 ng-switch-when="true" 或 default 或 false。
<p ng-switch on="(status == 'wrong') || (status == 'incorrect')">
<span ng-switch-when="true">
Wrong
</span>
<span ng-switch-default>
Correct
</span>
</p>
【讨论】：
单个ng-switch-when 不能有多个条件。
另一种选择是使用ng-if，但在错误处理的情况下，我更喜欢在控制器的范围内填充错误变量，并使用ng-show=error。
【讨论】：
您可以添加另一个开关盒。
示例：
<p ng-switch="status">
<span ng-switch-when="wrong">
Wrong
</span>
<span ng-switch-when="incorrect">
Wrong
</span>
<span ng-switch-default>
Correct
</span>
</p>
【讨论】：