angularjs:ng开关中的多个值

我有下面的开关：

<p ng-switch="status">
    <span ng-switch-when="wrong|incorrect">
       Wrong
    </span>
    <span ng-switch-default>
       Correct
    </span>
</p>

错
对的

---

如您所见，我有两个选项的文本

error

和

correct

。我已经尝试过（如您所见）使用管道

|

，但没有成功。有什么建议吗？

您可以添加另一个开关盒

示例：

<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>

错
错
对的

---

实例：

当使用一个

ng开关时，您不能有多个条件

一种替代方法是使用
ng if
，但在错误处理的情况下，我更喜欢在控制器的作用域上填充一个错误变量，并使用
ng show=error
您可以向
状态添加一个过滤器，将表示相同内容的值映射到相同的值中

.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>


{{getStatusMessage（状态）}
这与使用ng if几乎相同，但其优点是，您可以在主ng开关中多次使用ng开关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>


错
对的


Live:
这无法通过angular的基本指令实现，但是如果您愿意，您可以编写自己的指令来实现这一点，并且可以与现有的ngSwitch指令交互

ngSwitchController有一个属性
cases
，它是一个映射。每个case键的前缀都是
和默认大小写等于
？
。每个case值都是一个具有两个属性的对象：
transclude
和
element


警告：与此不同，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);
            });
        }
    }
});

示例plunker:
对于角度>=v1.5.10

您可以通过添加
ng开关when separator=“|”
到
ng开关when
节点来实现。



请参阅此处的讨论
注意，根据我的经验，它对数字不起作用……但是？
ng选项选择开关可能会有所帮助

选择1
选择2
选择3
选择选项1

选择选项2

选择选项3

您能解释一下switch语句的逻辑吗？您想做什么？如果变量
status
包含值
error
或
error
，我想显示文本
error
。对于所有其他值，它应该显示文本
Correct
这是正确的，但它没有回答问题。那么问题是什么？ng开关中的多个值不仅仅是ng开关，但为什么您希望ng开关中的多个值？为什么不能用另一个ng开关来实现呢？我想是干巴巴的原因吧？你的答案应该包括对你的代码的解释以及它如何解决问题的描述。与“ng if”相比，它有什么优势？如果有许多切换情况，那么就有性能优势，比如ng if为每个ng if设置了一个观察者，而ng switch只设置了一个观察者。这是最相关的，如果你在一个ng重复，那么所有这些观察者将加起来。优秀的解决方案！。应将其标记为正确答案。非常好且低于评分D尽管文档阅读了其他内容，但此功能尚未在v1.5.8中，但将进入1.5.9以后的版本（请参阅：）。
<span ng-switch-when="wrong|incorrect" ng-switch-when-separator="|">

<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>