一种将服务加载到 angular 2 中所有组件的方法

Question

我构建了一个名为 lang.service.ts 的服务。它所做的只是一个 key: value 机制。每当我需要它到我的组件时，我都会导入它并在 constructor 中声明它，然后我将它用作 {{lang('key').text}}。到目前为止，还不错。

我注意到我要为每个组件加载它，例如 view-header.component.ts、view-footer.components.ts 和许多其他组件。我从未使用过 Angular 1，但是 IIRC，我可以在那里做类似 rootScope.lang(..) 的事情，它可以完成我正在寻找的东西。有没有办法在 Angular 2 中做类似的事情？

Answer 1

如果您在根组件中注册服务，则所有子组件都可以访问该服务。

在您的根组件上...

import { Component } from '@angular/core';

import { YourService } from './my-servive.service.ts';
import { ChildComponent } from './child-component.component.ts';

@Component({
  selector: 'root-component',
  providers: [YourService],
  directives: [ChildComponent],
  template: `<child-component></child-component>`
})
export class RootComponent {}

在您的子组件上...

import { Component } from '@angular/core';
import { YourService } from './my-servive.service.ts';

@Component({
  selector: 'child-component'
})
export class ChildComponent {
  contructor(private myService: YourService) {}
}

希望对您有所帮助。

一种将服务加载到 angular 2 中所有组件的方法

A way to load service to all of the components in angular 2

javascript

components

angularjs

angularjs-rootscope