Angular 2 ngSwitchCase，OR 运算符不工作

Question

我有多个 switch 语句，但对于某些情况，我需要常见的情况。所以，我正在尝试

OR operator => ||

示例：

        <ng-container [ngSwitch]="options">
            <ng-container *ngSwitchCase="'a'">Code A</ng-container>
            <ng-container *ngSwitchCase="'b'">Code B</ng-container>
            <ng-container *ngSwitchCase="'c'">Code C</ng-container>
            <ng-container *ngSwitchCase="'d' || 'e' || 'f'">Common Code</ng-container>
            <ng-container *ngSwitchDefault>Code Default</ng-container>
        </ng-container>

输出：

if case = 'd' returns Common Code
else if case = 'e' and 'f' returns the Code Default

此处倒数第二个案例由多个案例组成，现在默认情况下 case 'd' 仅适用于 case 'e' and 'f'。

我在 ngSwitchCase 文档中看不到任何多重案例：

https://angular.io/docs/ts/latest/api/common/index/NgSwitchCase-directive.html https://angular.io/docs/ts/latest/api/common/index/NgSwitch-directive.html

Angular 2 不支持 ngSwitchCase 中的 || 运算符吗？

Answer 1

如果计算 'd' || 'e' || 'f'，结果是 'd'，而当 options 不是 'd'，则它不匹配。你不能那样使用 ngSwitchCase。

这可行：

    <ng-container [ngSwitch]="true">
        <ng-container *ngSwitchCase="options === 'a'">Code A</ng-container>
        <ng-container *ngSwitchCase="options === 'b'">Code B</ng-container>
        <ng-container *ngSwitchCase="options === 'c'">Code C</ng-container>
        <ng-container *ngSwitchCase="options === 'd' || options === 'e' || options === 'f'">Common Code</ng-container>
        <ng-container *ngSwitchDefault>Code Default</ng-container>
    </ng-container>

Answer 2

我认为这种语法更好：

    <ng-container [ngSwitch]="options">
        <ng-container *ngSwitchCase="'a'">Code A</ng-container>
        <ng-container *ngSwitchCase="'b'">Code B</ng-container>
        <ng-container *ngSwitchCase="'c'">Code C</ng-container>
        <ng-container *ngSwitchCase="['d', 'e', 'f'].includes(options) ? options : !options">Common Code</ng-container>
        <ng-container *ngSwitchDefault>Code Default</ng-container>
    </ng-container>

Answer 3

感谢 Bahador R，帮我制作了一个管道。

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'switchMultiCase'
})
export class SwitchMultiCasePipe implements PipeTransform {

    transform(cases: any[], switchOption: any): any {
        return cases.includes(switchOption) ? switchOption : !switchOption;
    }

}

用作

<ng-container [ngSwitch]="switchOption">
...
<div *ngSwitchCase="['somecase', 'anothercase'] | switchMultiCase:switchOption">

Angular 2 ngSwitchCase，OR 运算符不工作

Angular 2 ngSwitchCase, OR operator not working

angular

switch-statement

ng-switch

or-operator