生产中的ExpressionChangedAfterItHasBeenCheckedError

Question

版本详细信息

• Angular版本：7.3.7

[我读到此错误，发现它无法进入生产环境，但是在生产环境中我遇到ExpressionChangedAfterItHasBeenCheckedError。

错误消息：

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value:'ng-valid: true'. Current value: 'ng-valid: false'.

Angular.json中的配置：

"qa": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.qa.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "serviceWorker": true
            },

用于构建的脚本

node --max_old_space_size=5048 ./node_modules/@angular/cli/bin/ng build --prod --configuration=qa

问题：

我的问题是我在生产中如何得到此错误，如何解决？

更新

我刚刚注意到此行Angular is running in the development mode. Call enableProdMode() to enable the production mode.

问题：

所以我正在运行此脚本来构建我还需要做些什么来启用生产？node --max_old_space_size=5048 ./node_modules/@angular/cli/bin/ng build --prod --configuration=qa

Image of error in browser:

<< img src =“ https://image.soinside.com/eyJ1cmwiOiAiaHR0cHM6Ly9pLmltZ3VyLmNvbS9oTnJ6ZmtYLnBuZyJ9” alt =“ img”>

Image of environment

Answer 1

Main.ts应包含以下内容：

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

所以，有两件事必须是正确的。这需要在main.ts中存在，并且您的environment.qa.ts文件必须具有production = true。验证了这一点之后，请在此处设置一个断点，以确保这些值符合您的想法。

其他思想

您没有要求，但是无论如何我都会提供它-您需要纠正错误。 ExpressionChanged...错误的存在表明您的应用程序逻辑存在问题-很可能是您正在lifecycle hooks之一（例如AfterContentInit）中操作变量。这不太可能产生明显的效果，但是由于此错误，您可能遇到一些奇怪的错误。