Angular 角度5：函数调用在decorators中不受支持

我正在从Angular应用程序构建PWA，当我运行

ng build--prod

时，出现以下错误：

ERROR in app\app.module.ts(108,64): Error during template compile of 'AppModule'
Function calls are not supported in decorators but 'Environment' was called in 'environment'
'environment' calls 'Environment'.

但是，这毫无意义，因为我在类中添加了

export

，您可以在这里看到：

环境.产品ts

import { BaseEnvironment } from './base-environment';
import { ProspectBuilderModel } from '../app/models/prospect';

export class Environment extends BaseEnvironment {
  production: boolean = true;
  prospectBuilderModel: ProspectBuilderModel = {
    buildQuote: false,
    buildAcknowledge: false,
    buildOrganizationInfo: false,
    buildFinancialInfo: false,
    buildTradeInfo: false,
    buildPermissiblePurpose: false,
    buildUserSetup: false,
    buildPackageSelection: false,
    buildPaymentOptions: false,
    buildOrderOptions: false,
    buildVerifyOrganizationInfo: false,
    buildDocusignAuthorization: false,
    buildDocusignContract: false
  };
}

export const environment = new Environment();

import { ProspectBuilderModel } from '../app/models/prospect';

export abstract class BaseEnvironment {
  abstract production: boolean;
  abstract prospectBuilderModel: ProspectBuilderModel;
}

...
 ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    MultiselectDropdownModule,
    ReactiveFormsModule,
    HttpModule,
    ToastrModule.forRoot(),
    BrowserAnimationsModule,
    NgxMyDatePickerModule.forRoot(),
    PopoverModule.forRoot(),
    ModalModule.forRoot(),
    ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })
  ],
  providers: [
...

基本环境。ts

import { BaseEnvironment } from './base-environment';
import { ProspectBuilderModel } from '../app/models/prospect';

export class Environment extends BaseEnvironment {
  production: boolean = true;
  prospectBuilderModel: ProspectBuilderModel = {
    buildQuote: false,
    buildAcknowledge: false,
    buildOrganizationInfo: false,
    buildFinancialInfo: false,
    buildTradeInfo: false,
    buildPermissiblePurpose: false,
    buildUserSetup: false,
    buildPackageSelection: false,
    buildPaymentOptions: false,
    buildOrderOptions: false,
    buildVerifyOrganizationInfo: false,
    buildDocusignAuthorization: false,
    buildDocusignContract: false
  };
}

export const environment = new Environment();

import { ProspectBuilderModel } from '../app/models/prospect';

export abstract class BaseEnvironment {
  abstract production: boolean;
  abstract prospectBuilderModel: ProspectBuilderModel;
}

...
 ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    MultiselectDropdownModule,
    ReactiveFormsModule,
    HttpModule,
    ToastrModule.forRoot(),
    BrowserAnimationsModule,
    NgxMyDatePickerModule.forRoot(),
    PopoverModule.forRoot(),
    ModalModule.forRoot(),
    ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })
  ],
  providers: [
...

应用程序模块.ts

import { BaseEnvironment } from './base-environment';
import { ProspectBuilderModel } from '../app/models/prospect';

export class Environment extends BaseEnvironment {
  production: boolean = true;
  prospectBuilderModel: ProspectBuilderModel = {
    buildQuote: false,
    buildAcknowledge: false,
    buildOrganizationInfo: false,
    buildFinancialInfo: false,
    buildTradeInfo: false,
    buildPermissiblePurpose: false,
    buildUserSetup: false,
    buildPackageSelection: false,
    buildPaymentOptions: false,
    buildOrderOptions: false,
    buildVerifyOrganizationInfo: false,
    buildDocusignAuthorization: false,
    buildDocusignContract: false
  };
}

export const environment = new Environment();

import { ProspectBuilderModel } from '../app/models/prospect';

export abstract class BaseEnvironment {
  abstract production: boolean;
  abstract prospectBuilderModel: ProspectBuilderModel;
}

...
 ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    MultiselectDropdownModule,
    ReactiveFormsModule,
    HttpModule,
    ToastrModule.forRoot(),
    BrowserAnimationsModule,
    NgxMyDatePickerModule.forRoot(),
    PopoverModule.forRoot(),
    ModalModule.forRoot(),
    ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })
  ],
  providers: [
...

---

有人知道我能做些什么来解决这个错误吗？

我假设在您添加行之前，您的代码正在工作 ServiceWorkerModule.register（'/ngsw-worker.js'，{enabled:environment.production}）

通常，当我们在app module中访问环境变量时，它通常是指angular cli自动生成的环境文件（基本上是常量，并作为常量导出）。我从来没有尝试过创建类的对象并在app模块中传递它。这可能是导致问题的原因

---

试着直接在这行中传递一个true，而不是从一个对象中获取它，然后看看这是否有效。

下面是我最终提出的解决方案的代码。希望这有助于遇到此类问题的人。本质上，我只是修改了我的环境文件，这样它就不会创建环境类的实例。我猜Angular不喜欢实例化：

export const environment = {
  production: true,
  prospectBuilderModel: {
    buildQuote: false,
    buildAcknowledge: false,
    buildOrganizationInfo: false,
    buildFinancialInfo: false,
    buildTradeInfo: false,
    buildPermissiblePurpose: false,
    buildUserSetup: false,
    buildPackageSelection: false,
    buildPaymentOptions: false,
    buildOrderOptions: false,
    buildVerifyOrganizationInfo: false,
    buildDocusignAuthorization: false,
    buildDocusignContract: false
  }
}

---

有相同的问题，这里有可能的解决方法（如果您没有动态加载的属性）：

1.作为你的回答，反对就是了。 但是您会丢失默认属性和有关“要实现”属性的信息

2.使用静态类： 这里您将丢失“to implement”属性，因为抽象静态是，但您有类型和默认值

// default.env.ts
export class BaseEnvironment {
  public production: boolean = true;
  public specialPropToImpl: boolean = true;
}

// your.env.ts
export class Environment extends BaseEnvironment {
  public specialPropToImpl = true;
}

export const environment = Environment;

3.使用默认属性对象、接口和对象分配： 这里有“要实现”的属性、类型和默认值，但实现起来有点难看

// default.env.ts
export interface EnvProperties {
  production: boolean;
  specialPropToImpl: boolean;
}

export const defaultEnv = {
  production: true
};

// your.env.ts
export const environment: EnvProperties = {
  ...defaultEnv,
  specialPropToImpl: true
};

4.只需从环境中增加一个静态变量 简单的解决方案是，保留子类，但每个env文件都必须有它。但由于新环境文件是由旧环境文件的复制粘贴创建的，所以这可以正常工作。
根据生产值，您应该手动更改变量值。
不是非常灵活和可维护的解决方案。但很简单

// your.env.ts
export const enablePwa = true

// app.module.ts
import {environment, enablePwa} from 'env.ts'
//...
ServiceWorkerModule.register('/ngsw-worker.js', { enabled: enablePwa })

---

这个错误源于您试图将函数调用到装饰器中。如果您需要这方面的帮助，请发布调用函数的decorator，而不是随机代码。抱歉，但我不知道我在哪里调用了函数到decorator中。我上面发布的代码就是错误引用的代码。

app.module.ts

中的

ServiceWorkerModule

代码行引用了

environment.prod.ts

，它正在导入

baseEnvironment

类。这就是我发布所有代码的原因。如果您能告诉我缺少的任何信息，我将非常感谢您的帮助。好的，请尝试使用

ng build--prod--sm=false构建。这应该仍然会弹出一个错误，但可能不是同一个。它返回了相同的错误。那么，您有任何回购协议，我们可以浏览以查找您的问题吗？因为它不是来自您发布的代码，而且您似乎不愿意发布更多代码。感谢您的回复Arjun，但我只希望它在
environment.production==true
时为真。如果我将布尔值硬编码为true，那么即使
environment.production==false（当我在dev环境中运行时），它也会尝试注册服务工作者。我将这一行添加到app.module
中，因为Angular文档在处这样说：我的意思是尝试用硬编码的值替换它，以确定错误。如果AoT构建没有失败，那么我们将确定这是罪魁祸首代码。如果这确实是问题，您可能需要考虑传递此变量的其他方式。此外，您创建Env变量的方式与我们通常在角度CLI项目中设置Env变量的方式不同。env文件是在“src/environments”中创建的，可以在angular-cli.json中添加更多的环境。这是您在上面分享的示例中所期望的路径。谢谢Arjun。我刚到办公室，所以我要试一试。嗯。。。它正在使用硬编码的
true
。没有错误。那我该怎么办，阿琼？