“没有 TranslateService 的提供者”错误以某种方式连接到 npm install

Posted 2023-02-16

【中文标题】“没有 TranslateService 的提供者”错误以某种方式连接到 npm install

【英文标题】："No provider for TranslateService" error somehow connected to npm install

【发布时间】：2017-11-29 11:47:50

【问题描述】：

使用my Angular+Webpack+JHipster+yarn project 我收到以下错误。然后我删除node_modules 并运行“npm install”，它就消失了。然后我做这做那，它又回来了。怎么会？我不想这样做。错误中列出的 TranslateService 是由库提供的，不是我自己的，在我的项目的three generated components 中使用，但不是我写的。

ERROR Error: No provider for TranslateService!
    at injectionError (vendor.dll.js:1659)
    at noProviderError (vendor.dll.js:1697)
    at ReflectiveInjector_._throwOrNull (vendor.dll.js:3198)
    at ReflectiveInjector_._getByKeyDefault (vendor.dll.js:3237)
    at ReflectiveInjector_._getByKey (vendor.dll.js:3169)
    at ReflectiveInjector_.get (vendor.dll.js:3038)
    at GreatBigExampleApplicationAppModuleInjector.get (ng:///GreatBigExampleApplicationAppModule/module.ngfactory.js:515)
    at GreatBigExampleApplicationAppModuleInjector.getInternal (ng:///GreatBigExampleApplicationAppModule/module.ngfactory.js:2452)
    at GreatBigExampleApplicationAppModuleInjector.NgModuleInjector.get (vendor.dll.js:4005)
    at resolveDep (vendor.dll.js:11467)

【问题讨论】：

为时已晚，但即使我开始收到此错误，您是否找到任何解决方案？ @丹·坎克罗

好久没看这个项目了。它看起来不像我想出来的，但老实说，我不记得我是怎么离开的。这只是一个玩具应用程序。几年前我从 Angular 切换到了 React。

【参考方案1】：

或者您必须在没有 SharedModule 的情况下直接在 app.module.ts 中导出 TranslateModule，如下所示：

import  TranslateLoader, TranslateModule  from '@ngx-translate/core';
import  TranslateHttpLoader  from '@ngx-translate/http-loader';



@NgModule(
  declarations: [
    AppComponent,
    //..
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    //..
    TranslateModule.forRoot(
      loader: 
        provide: TranslateLoader,
        useFactory: httpTranslateLoader,
        deps: [HttpClient]
      
    ),
  ],
  exports: [TranslateModule],
  providers: [Title, HttpClient, HttpClientModule],
  bootstrap: [AppComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
)

// AOT compilation support
export function httpTranslateLoader(http: HttpClient):any 
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');

【参考方案2】：

我不是 100% 确定是怎么回事，但我删除了 yarn.lock，更正了节点版本差异，更新了 node_modules，现在似乎已修复。我的 pom.xml 有节点 6.11.0，但我一直在使用 6.10.3 来安装包和运行东西。

更新： 刮那个。问题又回来了。它在更改 node_modules/ 下的源文件后启动。在撤消更改后它仍然存在......删除yarn.lock后......删除目标/......完全重新安装所有节点模块后......签出主分支后。最后，在所有这些和重新安装所有节点模块之后，它再次工作。

我不知道发生了什么。

【参考方案3】：

作为documented on ngx-translate's github:

您必须在应用的根 NgModule 中导入 TranslateModule.forRoot()。

app.module.ts：

@NgModule(
  imports: [
    //...
    TranslateModule.forRoot(),
  ],
  //...
)

或者，如果您使用的是SharedModule：

如果您使用在多个其他功能模块中导入的 SharedModule，您可以导出 TranslateModule，以确保您不必在每个模块中都导入它

@NgModule(
  exports: [
    //...
    TranslateModule,
  ],
  //...
)

【讨论】：

谢谢。我的应用程序没有这些。但是，我生成了一个具有相同实体和配置的全新 JHipster 4.5.6 应用程序，它也没有这些导入。但不知何故，它起作用了。这让我认为自从这个问题开始以来添加的功能模块不是导入神秘地提供此服务的共享模块，但我已经检查并没有看到任何遗漏。我删除了最新功能，但这也无济于事。我的应用程序正在使用master。然后我检查了分支dashboard，得到了错误，提交，切换回master，仍然有问题。

看起来这是解决方案的一部分。显然 i18n 还不能在 JHipster 应用程序中的延迟加载页面上工作。将我的页面从延迟加载更改为急切加载，并将其添加到 app.module，现在似乎为 be working 尽管没有延迟加载。