Angular2.3 自定义库和依赖注入答案

【问题标题】：Angular2.3 Custom Library and dependency injectionAngular2.3 自定义库和依赖注入
【发布时间】：2017-05-04 19:48:45
【问题描述】：

我正在尝试将使用 yeoman 创建的自定义库中的服务注入到我现有的 ionic2 项目中。 lib 的 index.ts（将作为 npm 模块安装）：

@NgModule({
    imports: [
        CommonModule
    ],
    declarations: [
        SampleComponent,
        SampleDirective,
    ],
    exports: [
        SampleComponent,
        SampleDirective,
        SamplePipe
    ]
})
export default class SampleModule {
    static forRoot(): ModuleWithProviders {
        return {
            ngModule: SampleModule,
            providers: [SampleService, SettingsSVC]
         };
    }
}

在我的 ionic2 应用程序中，我想注入 SettingsSVC 和 module.ts。如果我将它添加到 app.module 的 imports-Section 中，它会说：

模块“AppModule”导入的意外值“SettingsSVC”

如果没有，我会收到控制台错误“未找到提供程序”。

类型（无论@Injectable 的类）本身被识别和链接，如果我将相同的类添加到我的 Ionic2 应用程序及其模块中的提供程序部分，它正在使用注入。

关于如何使它工作的任何建议？

【问题讨论】：

标签： angular typescript npm ionic2

【解决方案1】：

当它显示出意外值时，通常意味着您正在导入的内容未成功导入。

要么：

1- SettingsSVC 的路径错误

2- SettingsSVC 名称错误

3- 路径正确但 SettingsSVC 未导出

因此，为了确保您的导入实际上是导入 SettingsSVC ，请在其后放置一个 console.log 并将其注销

import {SettingsSVC} from 'the/path/'

console.log('SettingsSVC',SettingsSVC);

如果日志显示 undefined ，它肯定是上述之一（或者可能是类似的）。

顺便说一句，我有点困惑，您是想将 SettingsSVC 作为服务导入并将其放入您的提供程序中，还是要将其作为模块导入并放入 import:[] 中？

你不能两者兼得！

【讨论】：

【解决方案2】：

试试这个，

@NgModule({
  imports: [SampleModule.forRoot()],
  declaretions: [],
  providers: []
})
export class YourAppModule {}

【讨论】：