标签: angular11

尝试在代理背后的系统中构建 angular11 应用程序。运行“ng build --prod”时出现此错误：

字体内联失败。 通过 Internet检索https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap 时出错 。getaddrinfo ENOTFOUND fonts.googleapis.com

一些帖子说禁用它，指向这个角度文档URL以获取更多信息，但我无法让它工作。如果我将angular.json "optimization" 参数编辑到下面，我会得到一个架构验证失败...数据路径 .optimization 应该是布尔错误：

"optimization": { 
  "scripts": true,
  "styles": {
    "minify": true,
    "inlineCritical": true
  },
  "fonts": false
}

如果我按照这篇文章（搜索“自动字体内联”）并在package.json 中添加以下内容，它似乎没有任何效果：

"optimization": { 
  "scripts": true,
  "styles": false,
  "fonts": false
}

1. 我已将 Angular 版本从 5.2 升级到 11.2
2. 在升级 Angular 和所有库后，当我启动服务器（ng serve）时，分配失败 - JavaScript 堆内存不足
3. 它还生成 1 个包含信息的文件，但我没有得到

你能帮我解决这个问题吗？

1. Angular 版本和细节

我正在尝试按照此示例使用webpack5 模块联合来实现 Angular 中的微前端概念Module federation with Angular，但我面临这个错误

我尝试了这个答案中提供的解决方案，必须从注入上下文调用inject()，但它不起作用。

目前我在这两个应用程序中都使用 Angular 版本 11。

正在导入的应用程序的 package.json （子级）

    "resolutions": {
    "webpack": "5.0.0"
  },
  "dependencies": {
    "@angular/animations": "11.0.0-next.6",
    "@angular/cdk": "11.0.0-next.6",
    "@angular/common": "11.0.0-next.6",
    "@angular/compiler": "11.0.0-next.6",
    "@angular/core": "11.0.0-next.6",
    "@angular/forms": "11.0.0-next.6",
    "@angular/platform-browser": "11.0.0-next.6",
    "@angular/platform-browser-dynamic": "11.0.0-next.6",
    "@angular/platform-server": "^11.0.0",
    "@angular/router": "11.0.0-next.6",
    "@angular/service-worker": "11.0.0-next.6",
    "@fortawesome/angular-fontawesome": "^0.8.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.32",
    "@fortawesome/free-solid-svg-icons": "^5.15.1",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "angular-font-awesome": "^3.1.2",
    "bootstrap": "^4.3.1",
    "classlist.js": "^1.1.20150312",
    "core-js": "^3.1.4",
    "file-saver": "^2.0.2",
    "font-awesome": "^4.7.0",
    "js2xmlparser": "^4.0.0",
    "moment": "^2.25.3",
    "moment-timezone": "^0.5.28",
    "ngx-webstorage-service": "^4.1.0",
    "node-sass": …

在严格模式下使用 Angular 11 和 Typescript 4 我有：

export class ContactComponent implements OnInit { 

  form: FormGroup;

  constructor(private formBuilder: FormBuilder) { }

  ngOnInit() {

    this.form = this.formBuilder.group({ 
      email: ['', [Validators.required, Validators.email]],
      name: ['', [Validators.required, Validators.maxLength(40)]],
    });

  }

我收到构建错误：

 Property 'form' has no initialiser and is not definitely assigned in the constructor.

不应该在 ngOnInit 上初始化 FormGroup 吗？

client:159 src/app/analytics-page/analytics-page.component.ts:211:26 - error TS2345: Argument of type '{ type: string; options: { responsive: boolean; }; data: { labels: string[]; datasets: { label: string; data: number[]; borderColor: string; steppedLine: boolean; fill: boolean; }[]; }; }' is not assignable to parameter of type 'ChartConfiguration<"line" | "bar" | "scatter" | "bubble" | "pie" | "doughnut" | "polarArea" | "radar", number[], string>'.
  Types of property 'type' are incompatible.
    Type 'string' is not assignable to type '"line" | "bar" | "scatter" | "bubble" | …

我正在对我的 Angular 8 项目 \xe2\x86\x92 Angular 11 进行重大更新。

我很好地遵循了https://update.angular.io/?l=3&v=8.2-11.0的步骤。

我的项目中有一些软件包似乎与 v.^11 不兼容，因此我使用以下命令安装了这些软件包

npm install --legacy-peer-deps\n

当我尝试使用 提供内容时ng serve，我收到大量无法解析“util”和无法解析“zlib”消息。例如，

\n

错误：/Users/mf/node_modules/snapdragon/lib/parser.js 找不到模块：错误：无法解析\n\'/Users/mf/node_modules/snapdragon/lib\'中的\'util\'

\n

错误：/Users/mf/node_modules/sshpk/lib/certificate.js 未找到模块：错误：无法解析\n\'/Users/mf/node_modules/sshpk/lib\'中的\'util\'

\n

错误：/Users/mf/node_modules/sshpk/lib/private-key.js 未找到模块：错误：无法解析\n\'/Users/mf/node_modules/sshpk/lib 中的\'util\' \'

\n

错误：/Users/mf/node_modules/sshpk/lib/errors.js 找不到模块：\n错误：无法解析 \'/Users/mf/node_modules/sshpk/lib\' 中的 \'util\'

\n

错误：/Users/mf/node_modules/sshpk/lib/ed-compat.js 找不到模块：\n错误：无法解析 \'/Users/mf/node_modules/sshpk/lib\' 中的 \'util\'

\n

错误：/Users/mf/node_modules/sshpk/lib/identity.js 找不到模块：\n错误：无法解析 \'/Users/mf/node_modules/sshpk/lib\' 中的 \'util\'

\n

错误：/Users/mf/node_modules/static-extend/index.js 找不到模块：\n错误：无法解析 \'/Users/mf/node_modules/static-extend\' 中的 \'util\'

\n

错误：/Users/mf/node_modules/through2/through2.js 找不到模块：\n错误：无法解析 \'/Users/mf/node_modules/through2\' 中的 \'util\'

\n

错误：/Users/mf/node_modules/tough-cookie/lib/memstore.js 未找到模块：错误：无法解析\n\'/Users/mf/node_modules/tough-cookie 中的\'util\' /lib\'

\n

错误：/Users/mf/node_modules/tunnel-agent/index.js 找不到模块：\n错误：无法解析 \'/Users/mf/node_modules/tunnel-agent\' 中的 \'util\'

\n

0mError: …

我正在 Angular 11 中构建一个反应式表单。它分为多个 div，项目所有者希望在每个 div 中进行一些重复输入，以便用户可以编辑某个字段 A 和所有 div 的输入' 字段 A 的输入将显示更新后的值。

我喜欢科里兰的方法：

<input [formControl]="myCtrl" [value]="myCtrl.value" />
<input [formControl]="myCtrl" [value]="myCtrl.value" />
<input [formControl]="myCtrl" [value]="myCtrl.value" />

formControlName...但我想用而不是实现这一点，formControl以便我可以利用formGroups （而不是让每个表单控件成为我的组件对象的成员）。然而，缺乏对实际的引用myCtrl会破坏 处的绑定[value]。

有没有一个好的策略让我仅按名称指定表单控件并使所有这些输入都使用单个控件？或者，当有很多不同的集合需要同步时，是否有一种不同的好方法来同步 Angular 反应形式的输入？

在我的代码中使用此示例：https://stackblitz.com/edit/angular-rskaug ?file=src%2Fapp%2Fapp.component.html

组件中的 HTML

<td><input type="checkbox" (change)="onChange(employee.id, $event.target.checked)"></td>

组件中的打字稿

onChange(id: any, isChecked: boolean) {
    const idFormArray = <FormArray>this.myForm.controls.employeeRelatedId;

    if (isChecked) {
      idFormArray.push(new FormControl(id));
    } else {
      let index = idFormArray.controls.findIndex(x => x.value == id)
      idFormArray.removeAt(index);
    }
  }

错误详情

类型“EventTarget”上不存在属性“checked”。

45 <input type="checkbox" (change)="onChange(employee.id, $event.target.checked)">

我正在开发一个应用程序，我已经部署了我的应用程序，现在我面临的问题是我的一些产品文件花费了太多时间加载，这里是我的网络选项卡的屏幕截图。我在制作 prod 构建时也尝试过 --aot 和优化器命令 如何克服这个问题？

我正在使用 Cordova 和 Angular 11 开发 Ionic 5 应用程序，目前正在使用 SafetyNet Google API 来检测已 root 的设备。但是，我遇到了一个问题，当用户使用带有拒绝列表选项的 Magisk Manager 应用程序时，安全检查被绕过。

在参考Google官方文档后，我了解到SafetyNet API已被弃用，他们建议使用较新的Play Integrity API。我想知道如何将 Play Integrity API 与 Angular 11 集成到我的 Ionic 5 Cordova 应用程序中。

具体来说，我正在寻求以下方面的指导：

1. 我的 Ionic 应用程序中是否需要任何特定权限或配置才能与 Play Integrity API 进行通信？
2. 是否有任何可用的 Cordova 插件或库为 Ionic 中的 Play Integrity API 集成提供支持？
3. 如果没有现有插件，我如何在 Ionic 应用程序中直接调用 Play Integrity API 端点？

我广泛搜索了相关资源和文档，但没有找到任何将 Play Integrity API 集成到 Ionic 5 Cordova 应用程序与 Angular 11 中的具体示例或教程。

任何指导、代码示例或相关文档的引用将不胜感激。此外，如果在实施此集成时我应该注意任何注意事项或最佳实践，请告诉我。