How To Check Feature Is True On Different Environments In Angular?

I am using different environments in angular, stored into the environments folder, like: environment.ts environment.dev.ts environment.prod.ts In the environment.ts file, I have:

Solution 1:

Your environment.ts is the default config that's used when you import the environment file.

And the reason Angular is able to pick the right environment file during build is by utilizing a fileReplacements section in its config settings (see ng docs). That way it ensures that you use the correct environment.advanced.features value in your code.

Similar to the prod version in fileReplacements, you could define any kind of setting (ie. dev or testing) and refer to the corresponding environment file.

As for the viability of your approach-- personally I prefer using access roles to define which pages a user can see but I don't see any particular disadvantages of your approach either.