单击任何 [routerLink] 时的 Angular 2 事件

Question

我有一个简单的加载器服务，可以隐藏和显示某些加载器。我正在研究一些在连接速度慢的情况下会经常使用的东西，我需要在路由更改之间显示/隐藏加载程序。

当新路由加载以下内容时，我可以隐藏加载器。

this._Router.subscribe(() => {
    this._LoaderService.hide();
})

我正在尝试找到一种方法，当单击任何 [routerLink] 时(在路由更改开始时，而不是在结束)。

我环顾四周并尝试了 https://angular.io/docs/ts/latest/api/router/Router-class.html但我似乎无法弄清楚。

感谢任何帮助

Answer 1

有了这么多信息，不可能告诉您正确的方法，另请注意，加载程序服务实现因路由器实现而异。

要么你必须扩展 route-outlet 类并且应该在那里处理 loaderService 或者你必须自己处理链接的点击，

<a  [routeLink]=['User']>User</a>

改变它，

<a (click)="changeRoute('User')">User</a>

然后，

import { Router } from '@angular/router';

constructor(private router: Router){}

changeRoute(routeValue) {
   this._LoaderService.show(); 
   //this will start the loader service.

   this.router.navigate([routeValue]); 
   // you have to check this out by passing required route value.
   // this line will redirect you to your destination. By reaching to destination you can close your loader service.
   // please note this implementation may vary according to your routing code.

}

当特定的路由/链接/组件变为事件状态时，在该组件内，您可以随时随地关闭加载程序服务。