我有如下路由器链接:
<button class="take-a-tour-btn" [routerLink]="['/dashboard',{'showTour':'show'}]">
我想传递参数showTour.但是,当我这样做时,参数在url中可见,我想隐藏它.我经历了这么多的引用(关于可选参数的说法),但在我的案例中没有成功.我该怎么解决这个问题?
我不确定,是否有办法,因为数据需要在URL字符串中显示.
原文链接:https://www.f2er.com/angularjs/142312.html我的建议是使用存储所需数据的全局服务.例如:
//some dataService,which store your needed data. @Injectable() export class DataService { _showTour: string; set showTour(value: string) { this._showTour = value; } get showTour(): string { return this._showTour; } constructor() {} }
并以这种方式在导航组件中使用它:
//your navigation component @Component({ selector: 'my-app',template: ` <button class="take-a-tour-btn" (click)="onClick()"> ` }) export class SomeComponent { constructor(private dataService: DataService,private router: Router) { } onClick() { this.dataService.showTour = 'show'; this.router.navigate(['/dashboard']); } }
您可以在仪表板组件中使用相同的服务,并获得所需的值,例如:通过这种方式:
//your dashboard component @Component({ selector: 'my-dashboard',template: ` <h1>{{ showTour }}</h1> ` }) export class DashboardComponent implements OnInit { showTour: string; constructor(private dataService: DataService) { } ngOnInit() { this.showTour = this.dataService.showTour; } }