Question

这里是add-new-folder.component，当我从folder.component到add-new-folder.component进行路由时，我想在其中使用folder.component参数userid时，此组件是folder.component的子组件子组件，我尝试下面的代码，但是我获得了控制台NaN，如何在子组件中获取父组件参数对我有帮助？

add-new-folder.component.ts

constructor(private route : ActivatedRoute,private router : Router){}  

ngOnInit() {     
  this.route.parent.params.subscribe(params => {
    const parentRouteId = +params['userid'];
    console.log(parentRouteId);
  });
}

folder.component.html

<mat-icon [routerLink]="['/addNewFolders/',userid]">folder</mat-icon>

app-routing.module.ts

const routes: Routes = [
 { path: 'folder/:userid', component : FolderComponent,
   children: [
     { path: 'addNewFolders/:userid', component : AddNewFolderComponent },
   ]},
];

Answer 1

尝试这种方法。首先在任何通用文件中创建两个通用方法，这些方法将用于获取和设置您的ID。

let parameterId : string=" ";
export function setParameterId(id) {
  parameterId = id;
}

export function getParameterId() {
  return parameterId;
}

在导航到子组件之前，先调用this.setParameterId(id);，然后在导航到子组件之后，通过调用this.getParameterId()

Answer 2

在路线链接中添加以下属性以保留参数。

$self->reply->static('Demo/index.html');

您只需要保留queryParams即可将参数也传递给子组件

Angular 5：如何在子组件中获取父组件的路由参数？

2 个答案: