将对象传递到路由器中的另一个组件

Question

我有一个像这样的todoDetail组件：

<mat-card class="todos" [class.done]="todo.done === true">

  <h3>
    <input (change) = "done(todo.id)" [checked]="todo.done" type="checkbox"/>
    <a [title]="todo.name + ' details'" >
      {{ todo.name }}
    </a>
    <button (click)="delete(todo.id)" class="del" mat-mini-fab color="warn" aria-label="Delete todo">
      x
    </button>
    <button routerLink="/editTodo" class="edit" mat-mini-fab color="accent" aria-label="Edit todo">
      Edit
    </button>
  </h3>
  <p>{{todo.urgency}}</p>
  <p *ngIf="todo.description">
    Description: {{ todo.description }}
  </p>
</mat-card>
<br>

我想要的是，当我单击编辑按钮时，它将带我进入编辑待办事项屏幕，该屏幕是添加待办事项屏幕，但已填充待办事项的值。我指定了以下路线：

{ path: 'addTodo', component: AddTodoComponent },
{ path: 'editTodo', component: AddTodoComponent },

单击编辑后，如何将待办事项数据传递给该组件？我是Angular的新手，所以我希望这是有道理的。谢谢！

Answer 1

您可以将路由绑定到控制器中的功能，并将其他可选参数发送给接收者。尝试以下操作

app.component.html