如何使全局变量和功能，可以在所有组件角度4

我正在努力与全球变量因为我想要一些变量，我需要在所有组件访问，所以我应该怎么做在角4。如何使全局变量和功能，可以在所有组件角度4

我已经试过这样的事情：

创建一个文件与global.ts的名称，并提出了类名GlobalComponent像这样

export class GlobalComponent { 
    globalVar:string = "My Global Value"; 
}

，并使用它HeaderComponent我通过导入和制作实例，它的工作正常，但这是非常漫长的过程导入每个文件，以获得它。

所以我希望它可以在所有组件上使用而不需要导入它。

是否有任何方法或窍门来实现这一目标？任何建议，将不胜感激:)

来源

2017-10-12 Hidayt Rahman

我不认为你想要做什么是可能的，这可能不是一个好主意。

导入语句是webpack（或其他打包程序）如何构建树来确定要包含哪些文件。因此，将全局文件内置到所有捆绑包中可能会非常棘手。

另外我会补充说，我不确定只是导入静态文件是要走的路。它有点快速和肮脏，这可能是你想要的，但是对于生产应用程序，我会建议做一个角度服务并注入它。

export class GlobalVariablesService { 
    globalVar:string = "My Global Value"; 
}

这样你就可以嘲笑这些单元测试或者可能传递不同的变量，这取决于你将来不断变化的需求。

如果您需要这些更新并将其推送到整个应用程序的许多组件中，则可以查看Redux。它非常适合那种事情。

对不起，也许不那么@bgraham是在暗示你所希望看到

来源

2017-10-12 16:44:47 bgraham

感谢您的好建议，这对于拥有1000个以上组件的最大应用程序来说只是我的观点，我们需要在800个组件中添加全局文件。所以这将是如此漫长和糟糕的方式来完成它，并且非常难以管理一年。不是吗？ –

肯定会有点冗长。也不得不一直从@angular导入{Component}，但这是确保代码高效捆绑的体系结构的一部分。它是一个权衡。另一方面，我认为这不会触及到管理。没有全球命名空间污染，这是一个加号。而且您将对您的服务有精细的控制。 800个地方将来很容易进行更改和更新。该服务仅在一个地方，但随处可见。 – bgraham

答案，这绝对是更好地让角喷油器来实例化的服务。

但是，您也可以使用键值对（包括函数）导出一个简单的对象。然后你可以简单地导入它并使用它（没有实例化部分）。

globals.ts文件：

export const GLOBALS = { 
    globalVar: 'My Global Value', 
    globalFunc:() => alert('123') 
};

your.component.ts文件：

import { GLOBALS } from './globals.ts'; 

console.log(GLOBALS.globalVar); 
GLOBALS.globalFunc();

顺便说一句，我不认为有一种方式如何摆脱import语句 - 即是打字稿工作的一部分...

来源

2017-10-12 16:51:32

是@martin - 你说得很对，但是在800个组件中导入相同的文件也是一项艰巨的任务 –

是的，我明白了，但正如我在我的回答中指出的那样，可能没有办法摆脱导入语句它需要打字机知道你想要访问什么...... –

只需在src文件夹下创建常量文件 - constant.ts。

现在导入常量。每当你需要的参数TS文件被称为

它看起来像这样

出口常量不变= { COSNT_STRING： '我的全球价值'， }

如何使用常数：

1）导入文件。 2）constant.CONST_STRING

此外，这是一个很好的做法，从未来的预期，如果你想修改一个文件，而不是在800个文件中的变化的响应。

来源

2017-10-12 18:44:11 mangesh

这已经被@MartinAdámek –

建议，关于文件的更改，我们仍然需要在800个文件中进行更改以导入常量文件 –

如何使全局变量和功能，可以在所有组件角度4

回答

相关问题