Question

我正在写一个食谱网络应用程序，我的食谱都包含一系列成分，这就是我编写应用程序的方式

<h2>Add {{addRecipeForm.controls.name.value}}</h2>
<form [formGroup]="addRecipeForm">
  <label>Name:</label>
  <input type="text" formControlName="name" >
  <p *ngIf="addRecipeForm.controls.name.errors">This field is required!</p><p></p>
  <label>Serves:</label>
  <input type="text" formControlName="serves" >
  <p></p>
  <label>Steps:</label>
  <textarea  name="Text1" cols="60" rows="5" type="text" formControlName="steps" ></textarea>
  <p></p>
  <label>Remarks:</label>
  <textarea  name="Text1" cols="60" rows="3" type="text" formControlName="remarks" ></textarea>
  <p></p>
  <hr>
  <app-add-ingredient></app-add-ingredient>
  <hr>
  <button type="submit">Add new recipe</button> <button (click)="goBack()">Back</button>
</form>

我打电话来显示成分adder / lister，如何将add-ingredient组件构建的数组发送回其父级add-recipe组件，我查看了eventemitter但是如下所述：What is the proper use of an EventEmitter?它似乎不是一个好主意？或者至少不理想。

如果eventemitter不是将数组传递给父类的最佳方法，那么它是什么？服务或其他方式？

我还在这里找到了关于此类事情的官方文档https://angular.io/guide/component-interaction#!#parent-to-child-local-var 但我不知道如何在创建一个数组（由用户通过表单输入）之后将数组反馈给父类

Answer 1

最好的解决方案是使用只能通过两个组件访问的服务。

您会在角度文档https://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-service

上找到一些示例

将数组从子组件发送到父组件

1 个答案: