将服务用于子组件,而不必将其注入构造函数中 [英] Use a service for child components without having to inject it in the constructor

查看:71
本文介绍了将服务用于子组件,而不必将其注入构造函数中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想使用一项服务来获取有关应用程序支持的当前代币的信息.

I want to use a service for getting information about the current coins the app supports.

因此,我创建了以下服务:CoinsService

Therefore I have created the Service: CoinsService

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

const coins = {
  "btc":"bitcoin",
  "ltc":"litecoin"
};

@Injectable()
export class CoinsService {

  getCoins(){
    return coins;
  }

  getSpecificCoin(coinShortcut: string) {
    return coins[coinShortcut];
  }
}

我的用户类如下:

import { CoinsService } from './coins.service';

export class User {
  constructor(public id: number, public balance: number, public coinsService: CoinsService) {
    console.log(coinsService.getCoins());
  }
}

在服务创建之前,如果要创建用户,请按照以下步骤操作: 让userA = new User('1','200');

Before the service if I wanted to create a user I did it like this: let userA = new User('1','200');

现在有了服务,我需要在创建对象时传递coinService: 让userA = new User('1','200',coinService)

Now with the service I need to pass in the coinService at object creation: let userA = new User('1','200', coinService)

出于完整性考虑,我还发布了app.component.ts:

For wholeness I post also the app.component.ts:

import { Component } from '@angular/core';
import { User } from './user';
import { CoinsService } from './coins.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [CoinsService]
})
export class AppComponent {
  title = 'app';

  constructor(private coinsService: CoinsService){
      let userA = new User(1, 200, coinsService);
  }
}

是否有其他选项可以使用User类中的服务而无需 将其传递"到实际需要的组件?

Are there any other options to be able to use the service in the User class without "passing it down" to the component which actually needs it?

我想创建用户而无需每次都为每个用户明确需要CoinsService的情况.

I would like to create users without explicitly telling it everytime for every user that it needs a CoinsService.

应该成为所有创建的用户都可以访问它的标准.

It should be the standard that every user that gets created has access to it.

该服务也应该能够在App.Component之下的每个组件中使用. 这就是为什么我在providers数组中输入CoinssService的原因.

Also the service should be able to be used in every component below the App.Component. That's why I entered the CoinssService in the providers array.

感谢您的帮助.

推荐答案

您可以使方法static随处可见

@Injectable()
export class CoinsService {

  static getCoins(){
    return coins;
  }

  getSpecificCoin(coinShortcut: string) {
    return coins[coinShortcut];
  }
}


import { CoinsService } from './coins.service';

export class User {
  constructor(public id: number, public balance: number) {
    console.log(CoinsService.getCoins());
  }
}

尽管在使用静态属性时要小心,它们就像全局/共享属性.如果更改静态属性,它将在该类的所有实例中更改.

Be careful when using static properties though, they are like a global/shared property. If you change a static property, it will change in all of the instances of that class.

更多信息:"static"关键字有什么作用在上课吗?

这篇关于将服务用于子组件,而不必将其注入构造函数中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆