小编Ric*_*nho的帖子

根据 2017 年 Kara Erickson 在 Angular Connect 上的演讲，我一直在尝试在 Angular 中实现表单投影，但到目前为止没有成功。 谈话链接

不幸的是，唯一可用的代码出现在幻灯片中并且不完整，因此很难解决。这是我尝试过但它抛出错误：https : //stackblitz.com/edit/angular-form-projection-3

表单投影的想法是您有一些包装组件，其模板包含一个<form>元素，并将表单内容投影到其中（演讲中的示例是表单步进器）：

<!-- FormStepper -->
<form>
   <ng-content></ng-content>
</form>

<!-- containing template, e.g. AppComponent -->
<form-stepper>
   <div ngModelGroup="address">
      <input name="street" ngModel/>
      <input name="city" ngModel/>
   </div>
</form-stepper>

像这样的简单实现会导致错误，因为 ngModelGroup 指令期望在表单内，但由于组件边界而无法找到表单指令（ControlContainer 类）。

根据 Kara 的说法，解决方案是从 FormStepperComponent 的提供者提供 ControlContainer 类。使用@ViewChild() 装饰器查询，您可以从组件的视图中获取表单指令并将其存储在实例属性中，例如form.

  // within FormStepper
  @ViewChild(NgForm) form: NgForm;

然后在提供者数组中，使用 useFactory 为 ControlContainer 配置提供者，以便在请求时返回表单实例：

  providers: [
    {
      provide: ControlContainer,
      useFactory: component => {
        return component.form; …

使用ChromeVox屏幕阅读器时,我发现可以导航到选择框并选择选项,但我无法弄清楚如何让屏幕阅读器读出选项,这是我期望它做的.遗憾的是,我在文档中找不到答案.

我正在使用 Webpack 5，并且我想要一个 Service Worker，它可以在不访问网络的情况下拦截获取请求并在本地返回响应。我还希望能够在 Service Worker 中导入 npm 模块。我曾经为此使用一个名为serviceworker-webpack-plugin的库，但它不再维护，（并且在我使用时抛出错误）。Webpack 文档建议使用 Workbox，但据我所知，这似乎只是用于在 Service Worker 中缓存资产。有人能告诉我 2020 年使用 Webpack 5 创建 Service Worker 的正确方法是什么吗？