没有 TypeScript 的 Angular 8 依赖注入？答案

【问题标题】：Angular 8 Dependency Injection Without TypeScript?没有 TypeScript 的 Angular 8 依赖注入？
【发布时间】：2020-02-13 10:20:11
【问题描述】：

我目前正在关注将 AngularJS (1.5.x) 应用程序迁移到 AngularJS / Angular 8 混合的教程。我们已经决定暂时不使用 TypeScript，而是坚持使用 Babel 进行 JavaScript 转译。在没有 TypeScript 的情况下，我似乎在 Angular 中找不到任何关于依赖注入的信息。

app.module.js

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { UpgradeModule } from '@angular/upgrade/static';
import AppComponent from './app.component';
import angularJsModule from '../app/scripts/app';

@NgModule({
    imports: [
        BrowserModule,
        UpgradeModule
    ]
})

export default class AppModule {
    constructor(upgrade) {
        console.log('angular 8 plz?');
    }

    ngDoBootstrap() {
        this.upgrade.bootstrap(document.body, [angularJsModule.name], { strictDi: true });
    }
}

运行应用程序时，我收到 未捕获错误：无法解析 AppModule 的所有参数：(?)。

我认为这是因为没有 TypeScript 而没有注入 UpgradeModule？ https://angular.io/guide/dependency-injection#dependency-injection-tokens

我已经尝试在构造函数中设置this.upgrade = upgrade，但是这从未达到，因为Angular 不知道upgrade 是什么。

有没有办法在没有 TypeScript 的情况下注入 UpgradeModule？

或者我遇到的错误是因为不同的原因？

【问题讨论】：

...not use TypeScript just yet ← 什么？为什么？您可以将 typescript 用于您的“新”角度代码，而无需重写您的 angularjs 代码。它不必是全部或全部。
所有 JS 代码都是有效的 TypeScript 代码。 TypeScript 只是一个 JS 超集，你说不使用 typescript 是什么意思？ Angular 是一个框架，而不是一个库，它需要 TS（如果您使用 AngularDart，则需要 Dart）。你为什么要向AppModule 注入一个模块？

标签： angular dependency-injection angular-hybrid

【解决方案1】：

你必须使用Inject

进口：

import { NgModule, Inject } from '@angular/core';

改变构造函数：

constructor(@Inject(UpgradeModule) upgrade) {
  this.upgrade = upgrade;
}

【讨论】：

你可以在 AppModule 中注入一个模块？！
@Florian - 是的。另请参阅angular.io/guide/upgrade#bootstrapping-hybrid-applications，app.module.ts 的代码部分
@Igor 谢谢。抱歉耽搁了，装饰器作为函数参数遇到了 Babel 问题。需要添加babel-plugin-parameter-decorator。