Angular 2/4 Injectable中函数的单独文件

Angular 2/4 Injectable中函数的单独文件,angular,typescript,angular2-services,angular2-injection,Angular,Typescript,Angular2 Services,Angular2 Injection,我正在编写一个可能会呈指数增长的服务,我希望能够编写单独的文件,并将它们加载到组件使用的@Injectable中。通常我只需要编写多个服务并将每个服务注入组件中,但我的组件已经相当庞大,我觉得如果我可以加载一个服务并处理这一个服务中的所有功能,那么维护起来就更容易了。我希望我只是没有在谷歌上搜索到正确的东西,这就像导入一样简单 大致思路如下: -配置fns1.ts -configfns2.ts(包含我希望作为config.service提供的多个ts函数) -config.service.ts

我正在编写一个可能会呈指数增长的服务,我希望能够编写单独的文件,并将它们加载到组件使用的@Injectable中。通常我只需要编写多个服务并将每个服务注入组件中,但我的组件已经相当庞大,我觉得如果我可以加载一个服务并处理这一个服务中的所有功能,那么维护起来就更容易了。我希望我只是没有在谷歌上搜索到正确的东西,这就像导入一样简单

大致思路如下:

-配置fns1.ts

-configfns2.ts(包含我希望作为config.service提供的多个ts函数)

-config.service.ts

import { Injectable } from '@angular/core'
//{{Possibly import functions here}}

@Injectable ()
export class ConfigService {

  //{{Or possibly load within the class}}

}
import { Injectable } from '@angular/core'
import * as configFns1 from './configfns1.ts'
import * as configFns2 from './configfns2.ts'

@Injectable ()
export class ConfigService {

  fn1() {
    configFns1.fn1();
  }

  fn2() {
    configFns2.fn2();
  }
}
-config-view.component.ts

import { Component, OnInit } from '@angular/core';
import { ConfigService } from '../services/config.service';

@Component({
  selector: 'app-config-view',
  templateUrl: './config-view.component.html',
  styleUrls: ['./config-view.component.scss']
})

export class ConfigViewComponent implements OnInit {

  constructor(private configService: ConfigService){  }

  ngOnInit() {
          this.configService.configfn1(); //<---This would be a function loaded from configfns1.ts, and injected from config.service.ts
      })

  onClick() {
    this.configService.configfn2(); //Another fn loaded from configfns2.ts
  }

}
从'@angular/core'导入{Component,OnInit};
从“../services/config.service”导入{ConfigService};
@组成部分({
选择器:“应用程序配置视图”,
templateUrl:'./config view.component.html',
样式URL:['./config view.component.scss']
})
导出类ConfigViewComponent实现OnInit{
构造函数(私有configService:configService){}
恩戈尼尼特(){

这个.configService.configfn1();//在更多的谷歌搜索之后,我发现这是一个简单的typescript导入答案

-config.service.ts

import { Injectable } from '@angular/core'
//{{Possibly import functions here}}

@Injectable ()
export class ConfigService {

  //{{Or possibly load within the class}}

}
import { Injectable } from '@angular/core'
import * as configFns1 from './configfns1.ts'
import * as configFns2 from './configfns2.ts'

@Injectable ()
export class ConfigService {

  fn1() {
    configFns1.fn1();
  }

  fn2() {
    configFns2.fn2();
  }
}
fn1()和fn2()可以正常调用