angular - 角度无法接收发出的值

Question

我正在尝试从 to 发出DropdownComponent值TaskComponent：

DropdownComponent位于NavBbrComponent( AppModule)TaskComponent内MainComponent，属于HomeModule。

DropdownComponent里面有定义select：

<select class="form-control minimal" id="project" name="project" [(ngModel)]="selectedProject" (change)="onChange($event.target.value)">
  <option>Project 1</option>
  <option>Project 2</option>
</select>

使用onChange发出值的方法：

onChange(event) {
    this.toTask.emit(event);
  }

值绑定在主组件中，其中任务组件的定义

<app-task (toTask)="fromDropdown($event)"></app-task> 

但没有任何价值TaskComponent。

堆栈闪电战

Answer 1

因为您DropdownComponent和TaskComponent组件没有任何类型的父子关系，您必须使用某种服务在这些组件之间传递数据。

我刚刚更新了你的DEMO，你可以在那里找到解决方案。

SAMPLE DEMO

Answer 2

你的方法是完全错误的。Angular 中的事件无法通过不包含它们的组件中的输出访问我的意思是这个

<app-task (toTask)="fromDropdown($event)"></app-task>

意味着您toTask在 app-task 组件中有事件，您可以在 you 中访问它main-component。

在具有该关系的组件之间传输数据的正确方法是创建服务并在导航栏组件中向服务发出值，并在您的任务组件中监听它们。你需要使用Subject来解决这个问题。有很多关于这个的答案在这里。