Angular 2-存储全局变量(如身份验证令牌)以便所有类都可以访问它们的最佳方法是什么?

Angular 2-存储全局变量(如身份验证令牌)以便所有类都可以访问它们的最佳方法是什么?,angular,typescript,Angular,Typescript,仅限第2个问题: 存储全局变量(如身份验证令牌或基本url(环境设置))的最佳方法是什么,这样所有类都可以访问它们,而不会在刷新时丢失它们 因此,当我登录时,我会给用户一个auth令牌,并通常将其存储在angular 1.x的$rootscope中。在我看来,在全局变量(如$rootscope)上存储这样的参数被认为是一种不好的做法。在Angular 1.x上,您应该使用服务(Singleton)从任何地方获取这些数据。这样,您的数据将从任何地方都可用-您可以注入您的服务并获得价值。您还可以在单

仅限第2个问题:

存储全局变量(如身份验证令牌或基本url(环境设置))的最佳方法是什么,这样所有类都可以访问它们,而不会在刷新时丢失它们


因此,当我登录时,我会给用户一个auth令牌,并通常将其存储在angular 1.x的$rootscope中。

在我看来,在全局变量(如$rootscope)上存储这样的参数被认为是一种不好的做法。在Angular 1.x上,您应该使用服务(Singleton)从任何地方获取这些数据。这样,您的数据将从任何地方都可用-您可以注入您的服务并获得价值。您还可以在单元测试时模拟/监视此服务

Angular 2应用程序应作为一个整体构建。我想对于您的场景来说,最好的解决方案是使用根组件下的服务保存它,并将其作为输入传递给子组件

这样,您的数据将从主组件进行控制。它将是不可变的(子组件无法更改它),并且您的组件将没有外部引用(这是迈向良好组件体系结构的重要一步)

如果你仍然想用“Angular 1.x方式”来实现,我想你可以在任何地方注入这个服务并使用它的值。它不是首选选项,但比全局变量更好


希望这会有所帮助。

要创建真正的全局范围数据,您应该在应用程序引导过程中将class\object\value注册为引导函数的依赖项参数

bootstrap(MyApp,[MyGlobalService])

这将在根级别注册您的服务
MyGlobalService
(实际上它可以是对象、工厂函数或您自己的提供者)。这个依赖项现在可以被注入到任何组件中

与Angular1不同,Angular2应用程序有多个喷油器,部件和喷油器之间有一对一映射。每个部件都有自己的喷油器

Angular developer guide中有一些很好的注册示例。请参阅上的指南


@Yaniv已经强调了另一个选项

在您的特定场景中,您实际上希望将令牌存储在本地存储中,因为页面刷新会导致您丢失存储在内存中的令牌值。

您还可以将令牌用于全局数据(jwt令牌除外),并以redux方式将其传递给“已连接”组件。

配置注入器。通过这种方式,您可以请求在需要访问值的任何地方获得注入值。我不知道实际的语法,因此只能作为注释。例如,根据您的说法,我必须创建类/服务,然后在这里声明要使用的全局变量,然后在所有子组件中导入此服务?如果我有50多个类/组件,那么我必须导入该服务50多次,这不是太长的过程吗?依赖于50多个类的类很可能是一个糟糕的设计。即使有n个服务,也可以将它们分组为主要一起使用的服务的伞式服务。尽管如此,还是最好使用更小的组件和更少的依赖项。这些组件可以组合在一起以实现所需的功能行为。不幸的是,在执行诸如渲染SVG之类的操作时,需要这样做。每个SVG都需要一个单独的模板,因此必须成为一个组件。当然,我们有几十个视图组件,如果我们必须在每个视图组件中注册它们,那么代码就会变得一团糟。从理论上讲,不允许全局作用域是一件好事,但对于许多实际应用程序来说并不实用。@PardeepJain这是Angular 2方式,许多重复的事情“使用根组件下的服务保存它,并将其作为输入传递给子组件。”这是一个好主意。使用DI是一个很滑的斜坡,让每个[friggin]模块都分散到其他[friggin]模块。这就是为什么在Angular 1.x中,我习惯于将所有基本数据(急切加载的数据、美国州代码等)展平到
$rootScope
上,并将其引用为
$root
。这是我视图的唯一全局视图,因为每个控制器/指令都使用了
controllerAs:“因此”
,因此我无法访问任何其他范围。NG2现在已经解决了所有这些问题,但我仍然希望我们有
$root
。那么如何将全局服务的变量访问到其他子类/组件中呢?@PardeepJain通过在它们的构造函数中注入