Angular 是否有可能以角度保护一种方法？

我想知道是否有可能在Angular应用程序中保护方法而不是路由。假设您有一个按钮，如果您单击该按钮但未登录，您将被重定向到登录页面

canActivate(next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> {
    let url: string = state.url;
    return this.loggedInService.isLoggedIn$.pipe(map(data => {
      if(!data) {
        this.router.navigate(['login']);
      }
      return data;
    }));
  }

---

谢谢

这里是一个工作示例。主逻辑在auth-guard中，如果它没有登录，我们将重定向到登录页面

canActivate(next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> {
    let url: string = state.url;
    return this.loggedInService.isLoggedIn$.pipe(map(data => {
      if(!data) {
        this.router.navigate(['login']);
      }
      return data;
    }));
  }

canActivate（下一步：ActivatedRouteSnapshot，
状态：RouterStateSnapshot）：可观察{
让url:string=state.url；
返回此.loggedInService.isLoggedIn$.pipe（映射（数据=>{
如果（！数据）{
this.router.navigate（['login']）；
}
返回数据；
}));
}

---

对于方法没有这样的保护措施。相反，您最可能的解决方案是在要保护的方法中创建条件检查

例如，如果需要保护的方法是checkoutCart（），并且您的angular应用程序中有一个服务通知您用户是否登录。然后，您可以在checkoutCart（）方法中执行以下操作：

checkoutCart() {
   if ( !this._authenticationService.isLoggedIn ) {
      this.router.navigate(['/', 'login']).then(nav => {
         console.log(nav); // true if navigation is successful
      }, err => {
         console.log(err) // when there's an error
       });

      return;
   }

   // REST OF YOUR PROTECTED CODE
}

---

要了解路由器的工作原理，您可以参考：

谢谢，这就是我的想法。我基本上是在用谷歌图书做和谷歌一样的事情。当你们想把一本书添加到你们的书架上但并没有连接时，你们将被重定向到登录页面。即使您没有连接，按钮也在这里。