无法解析角库导出中的Enum

Question

使用角库中的Enum类型将生成一个错误，因为在导入其他应用程序时不能解析枚举。

export enum Appearance {
    Basic = 0,
    Raised = 1,
    Stroked = 2,
    Flat = 3,
    Icon = 4,
    FAB = 5,
    MiniFAB = 6,
    Link = 7
}

谷歌搜索后，我发现我需要将Enum作为const。export const enum Appearance。但是我不能使用enum，因为我在HTML中使用Enum语句，如下所示

<button mat-raised-button *ngSwitchCase="buttonTypes.Raised">{{field.componentProperty.label}}
    </button>
<button mat-raised-button *ngSwitchCase="buttonTypes.Stroked">{{field.componentProperty.label}}
    </button>
<button mat-raised-button *ngSwitchCase="buttonTypes.Flat">{{field.componentProperty.label}}
    </button>

export class ButtonComponent implements OnInit {
  buttonTypes = Appearance  ==============> declaring here
  constructor() { }
  ngOnInit(): void {
  }
}

公共api.ts

export * from './lib/view-models/component-type.enum'

ERROR in ./src/app/user-module/users/car/car-search-filter/car-search-filter.component.ts
Module not found: Error: Can't resolve '@falcon-ng/core/lib/view-models/component-type.enum' in '/Users/macbook/Projects/RentalProjects/RentalUI/src/app/user-module/users/car/car-search-filter'

有没有更好的解决办法？

Answer 1

你可以采取以下两种方法之一：

或者尝试使用这里提到的使用preserveConstEnums编译器标志- https://stackoverflow.com/a/45942840/5350404

或者直接使用枚举值，如：

<button mat-raised-button *ngSwitchCase="RAISED">
  {{field.componentProperty.label}}
</button>
<button mat-raised-button *ngSwitchCase="STROKED">
  {{field.componentProperty.label}}
</button>
<button mat-raised-button *ngSwitchCase="FLAT">
  {{field.componentProperty.label}}
</button>

export class ButtonComponent {
  readonly RAISED = Appearance.Raised;
  readonly STROKED = Appearance.Stroked;
  readonly FLAT = Appearance.Flat;
}