如何在角度不同的环境下检查特征是否正确？

我使用的是ANGLE中的不同环境，存储在环境文件夹中，如下所示：

environment.ts
environment.dev.ts
environment.prod.ts

在环境.ts文件中，我有：

export const environment = {
  production: false,
  environment: 'Development',
  advanced: {
    features: true
  }
};

仅当环境的高级特性等于True时，我才想在页面中显示div元素。我正在考虑做以下事情：

import { environment } from './environments/environment';
export class AdvancedComponent implements OnInit {
  advancedFeatures:boolean;
  
  constructor() { }

  ngOnInit() {
    this.advancedFeatures= environment.advanced.features;

    if (this.advancedFeatures){
      console.log("true");
    }
    else {
      console.log('false');
    }
  }

}

如果环境是dev或prod，这是否足以隐藏或显示div元素？这是从环境中使用高级功能的好方法，还是应该以某种方式将所有环境导入到这个类中？

---

解决方案

您的environment.ts是导入环境文件时使用的默认配置。

并且Angel之所以能够在构建期间选择正确的环境文件，是因为使用了其配置设置中的fileReplacements部分(see ng docs)。这样可以确保您在代码中使用正确的environment.advanced.features值。

与fileReplacements中的prod版本类似，您可以定义任何类型的设置(即dev or testing)，并参考相应的环境文件。

至于您的方法的可行性--就我个人而言，我更喜欢使用访问角色来定义用户可以查看的页面，但我也看不出您的方法有什么特别的缺点。