将函数从服务文件传递到组件

Question

我对 Angular 比较陌生，并且正在努力将函数传递给组件。我有一个函数当前存储在一个服务文件中，需要传递给很多组件文件，然后在 html 中使用（通过字符串插值）。对我如何做到这一点有帮助吗？.

这里是服务文件以及需要传递给组件的函数

  text = {
    careHome: {
      resident: "Resident",
      carer: "Carer",
    },
    Domiciliary: {
      resident: "Client",
      carer: "Staff",
    },
    Hospital: {
      resident: "Patient",
      carer: "Nurse",
    },
  };

  careType = "Hospital";

  updateString(stringToChange: any) {
    let StringToReturn = this.text[this.careType][stringToChange];
    return StringToReturn;    

Here is the string interpolation 
<div>{{updateString('resident')}}<div>

我尝试使用构造函数传递它，但无法正常工作

Answer 1

• 首先你必须创建服务，将其注入到你的组件中，然后你可以在组件 html 中调用你的服务函数。

  @可注入() 导出类 YourService {

  constructor( ) { }
  
  text = {
    careHome: {
      resident: "Resident",
      carer: "Carer",
    },
    Domiciliary: {
      resident: "Client",
      carer: "Staff",
    },
    Hospital: {
      resident: "Patient",
      carer: "Nurse",
    },
  };
  
  careType = "Hospital";
  
  updateString(stringToChange: any) {
    let StringToReturn = this.text[this.careType][stringToChange];
    return StringToReturn;    
  }
  

  }

• 在您的组件中。

  构造函数（私有服务：YourService）{}

• 你可以打电话-

  {{this.service.updateString}}