angular - ngx-permissions - html 中没有硬编码的权限名称

Question

我正在使用ngx-permissions在我的 Angular 6 应用程序中。我有许多权限将在整个应用程序中使用，因此我希望有一个包含所有权限名称的常量文件 - 例如:

import { Injectable } from "@angular/core";

@Injectable({
  providedIn: 'root'
})
export class Permission {
  public static CanViewX = 'CanViewX';
  public static CanEditX = 'CanEditX';
  public static CanAdministerX = 'CanAdministerX';
}

在检查 typescript 中的权限时，我可以引用这个 Permission 类:

import { Injectable } from '@angular/core';
import { NgxPermissionsService } from 'ngx-permissions';
import { Permission } from '../data/permission';

@Injectable({
  providedIn: 'root'
})
export class Service {

  constructor(private permissionsService: NgxPermissionsService) { }

  checkPermission() {
      this.permissionsService.hasPermission(Permission.CanViewX);
  }
}

但是，在检查 html 中的权限时，我很难使用我的 Permission 类。第二个<p>尽管我的用户确实拥有该权限，但从未显示过。对权限名称进行硬编码是可行的，但我想使用我的类，因为我可以看到，如果开发人员必须记住权限名称，就会出现拼写错误和错误。

<p *ngxPermissionsOnly="['CanViewX']">This will work</p>
<p *ngxPermissionsOnly="[Permission.CanViewX]">Viewers should be able to see this, but can't</p>

有没有办法避免在 html 中对我的权限名称进行硬编码？

Answer 1

最后我不想在 html 中硬编码权限名称，所以我在 .ts 文件中创建了一个属性，并在 html 中绑定(bind)到它。