Angular2 Child Routes

Asked

Viewed 219 times

2

const itemRoutes: Routes = [
{
    path: '', component: ItensComponent,
    children: [
        { path: '', redirectTo: 'lista', pathMatch: 'full' },
        { path: 'lista', component: ListaItensComponent },
        { path: 'novo', component: NovoItemComponent },
        { path: 'edita/:id', component: EditaItemComponent }
    ]
}

];

Listaitenscomponent

 editaItem(id: string) {
  this.router.navigate(['../edita', id], {relativeTo: this.route});

}

How can I return to the Listitenscomponent after editing the item ??

angular

2 answers

1

You can return using the command history.back(); which I believe is not the best way, or using this._router.navigate(['../'], { relativeTo: this._routeParams }); which in my case works, but my route configuration is different from yours.

export const routing: ModuleWithProviders = RouterModule.forChild([
    { path: '', component: MarcaListComponent },
    { path: ':id', component: MarcaFormComponent }
]);

To add a new item I use the editing route, but passing an id equal to zero. Below follows the two methods (add, edit):

add() {
    if (this.enableAdd) {
        this._router.navigate([0], { relativeTo: this._route });
    }
}

edit() {
    if (this.enableEdit) {
        this._router.navigate([this.selectedItem.id], { relativeTo: this._route });
    }
}

0

From what I understand, you want to access the object you want to edit in the Editaitemcomponent. You through the route can not send objects to other components, so the easiest way is to use a service that has your list of objects and when you want to edit an object you use the route to pass the id and then in the Editaitemcomponent component you access that service and get to the object that corresponds to the id for editing.

Browser other questions tagged angular

You are not signed in. Login or sign up in order to post.