我一直在尝试开发一个待办事项列表项目。我有四个组件：每日、项目列表、项目和添加任务日志x1c 0d1x
daily组件包含一个表单和一个显示表单中的值的列表。
以下是代码：

每日.服务.ts

此服务代码用于从表单中获取值并将其添加到列表中。

import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { DailyTask } from './models';

@Injectable({ providedIn: 'root' })
export class DailyService {

private _dailies$ = new BehaviorSubject<DailyTask[]>([]); 
public getDailies(): DailyTask[] {
return this._dailies$.getValue();
}

public setDailies(data: DailyTask[]): void {
 this._dailies$.next(data);
}

public getDailiesObservable(): Observable<DailyTask[]> {
return this._dailies$.asObservable();
}

public createTask(newTask: string): void{

console.log( "check");

  const dailyTask: DailyTask = { task: newTask, type: 'DAILY' };
  this.setDailies([dailyTask, ...this.getDailies()])
 }
}

每日.组件.Ts

export class DailyComponent implements OnInit {
  public dailyList$: Observable<DailyTask[]> | null = null;

  constructor(private _dailyService: DailyService) {}

  ngOnInit(): void {
    this.dailyList$ = this._dailyService.getDailiesObservable();
  }

  public addDaily(name: string) {
     this._dailyService.createTask(name);
  }
 }

每日.组件.html

<mat-card>
   <h1>Daily</h1>
    <app-item-list
      [type]="'DAILY'"
      [initialData$]="dailyList$"
      [onAddItem]="addDaily.bind(this)"
    ></app-item-list>
 </mat-card>

项目列表.组件.html

<div>
 <mat-form-field appearance="outline">
 <input
  matInput
  placeholder="Add a Task"
  (keyup.enter)="addTask()"
  autocomplete="off"
  [formControl]="nameControl"/>
 </mat-form-field>
</div>

<ng-container *ngIf="filteredData$ | async as data">

<app-item
  [value]="value"
  *ngFor="let value of data; index as index"
  (inputDataChange)="removeTask(data, index)"
>
</app-item>
</ng-container>

项目列表.组件.ts

export class ItemListComponent implements OnInit {
   
   nameControl = new FormControl('');
   @Input() public type: ItemType | null = null;
   @Input() public onAddItem: Function | null = null;
   
   constructor(private _homeService: HomeService) {}
   ngOnInit(): void {}

   addTask() {
     if (this.onAddItem) {
        this.onAddItem(this.nameControl.value);
        this.nameControl.reset();
   }
 }

项目.组件.html

<div class="displayTask">
  <div class="displayvalue" [ngClass]="{ 'line-through': value.task }">
     {{ value.task | uppercase }}
  </div>
</div>

物料.组件.ts

export class ItemComponent implements OnInit {
  @Input()
   value: any;
  constructor() {}
  ngOnInit(): void {}
 }

上面的代码集运行良好，下面的代码用于新组件task-dailog

任务日志.html

<div mat-dialog-title class="dailogHeader">
   <h1 >Create Daily</h1>
</div>

<div mat-dialog-content>
    <div class="dialogContent">
      <p>Task</p>
    <mat-form-field appearance="outline">
    <input
        matInput
        placeholder="Add a new Task"
        autocomplete="off"
        (keyup.enter)="addDailogTask()"
        [formControl]="nameControl"
    />
    </mat-form-field>
    </div>
</div>

任务日志.组件.ts

export class TaskDialogComponent implements OnInit {
  nameControl = new FormControl('');

  constructor(
    public dialogRef: MatDialogRef<TaskDialogComponent>,
    private _dailyService: DailyService,
  ) {}

  ngOnInit(): void {}

  onNoClick(): void {
    this.dialogRef.close();
  }

  addDailogTask(){
    const value$ =   this.nameControl.value;
    this.nameControl.reset();
    console.log(value$);
  }
 }

在task-dialog.component.ts中，我有一个从表单中获取值的函数，但我被困在这里，不知道如何继续。我想学习如何将此表单值从TaskDialogComponent发送到DailyComponent中的列表。
这里也是项目的Stackblitz。
有没有人能帮我这个忙。我对棱角相对较新，真的很感激你的帮助。提前感谢！。