Angular 组件之间的共享变量

有没有办法在Angular 5中的组件之间共享变量。例如，在登录后，我希望获得用户id，并将其传递给其他组件，以使用此id进行一些操作。我希望避免使用sesseionStorage、localStorage或参数。我想要一个对客户端不可见的变量。我听说了@Input@output，但我不知道正确的方法，你可以使用Angular

例如：

@Injectable({
    providedIn: 'root'
})
export class AuthService {
    userId: number;
}

然后在某些组件中：

@Component({...})
export class SomeComponent {
    constructor(private auth: AuthService) {
        // ...
    }

    // Do whatever you want with "userId" by using "this.auth.userId"
}

---

有几种方法可以做到这一点

• @Input

  和

  @OutPut

  当您没有大量嵌套组件时：

您有

ParentComponent

，然后有

ChildComponent

。所以一个家长，一个孩子，我会用这个

但是，如果结构更像

ParentComponent

->

FirstLevelChildComponent

->

SecondLevelChildComponent

，那么如果要在

SecondLevelChildComponent

中访问的值来自

ParentComponent

，您需要通过

SecondLevelChildComponent

->

FirstLevelChildComponent

->

ParentComponent

。这是太多的嵌套，最好的做法是不要超过1级的深度

解决方案是什么：

• 您可以使用在组件中注入的服务
• 使用状态管理（Redux）。这只是当你有一个复杂的应用程序时

有关更多信息，请参阅本文：

---

谢谢您的回答。我进行了测试，但当我重新加载页面时，该成员的userId丢失，它变得未定义，因此我必须再次登录，以便该成员可以有一个值。我想要一种方法，即使我像sessionStorage或localStorage那样重新加载页面，但客户端无法访问，这个成员也可以保持活动状态，他可以修改一个合理的数据当然可以，在您重新加载页面的那一刻，一切都重新启动了（这就是为什么人们使用

localStorage

或

sessionStorage

在刷新时保存数据）……我想你可以探索其他保存数据的方法（比如localdb之类的），但没有一种方法是完全安全的（如果这是你所关心的）。我使用Spring Boot Rest作为后端应用程序，Angular作为前端应用程序。我可以使用会话存储整个项目中需要的usersId和一些数据吗？许多客户端可以同时登录。我认为，在一个解决方案中，包括加密数据，然后将其存储在会话存储中，就像用户无法理解什么是stor一样问题是如何加密数据（例如字符串）使用Angular 5时，@Input中存储的变量是否在刷新页面后保持活动状态？否，刷新时不会存储任何内容。如果要存储这些变量，则需要使用cookie或本地存储来保存该值。您试图存储什么？如果它类似于JWT令牌，则使用本地存储。