Javascript 在角度服务中使用angularJS服务

我有一个angularJS应用程序，我正在慢慢转换为angularJS，所以我的计划是将它作为一个混合应用程序，直到我完全完成转换。我不能让我的angularJS服务在我的angular服务中工作。我在这里遵循以下步骤：

我有我的javascript angularJS服务：

"use strict";

export class DAL {
    get($q, $filter, $http, $log, IsoStringToDate, UnitConversion, $cookies, $uibModal, Utilities) {
        ... functions that do stuff ...
    }
}

(function() {

    var dal = function ($q, $filter, $http, $log, IsoStringToDate, UnitConversion, $cookies, $uibModal, Utilities) {
        var dalInst = new DAL();
        return dalInst.get($q, $filter, $http, $log, IsoStringToDate, UnitConversion, $cookies, $uibModal, Utilities);
    };

    angular
        .module('myWebApp')
        .factory('DAL', ['$q', '$filter', '$http', '$log','IsoStringToDate','UnitConversion','$cookies','$uibModal','Utilities', dal]);

}());

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

@Injectable()
export class TeamService {
    constructor(@Inject('TestService') testService: any) {
        console.log('TestService: ', testService.test());
    }
}

我有我的ajs-upgraded-providers.ts：

/// <reference path="./ajs-services/index.d.ts" />
import { DAL } from '../../app/scripts/factory/dal';

export function dalServiceFactory(i: any) {
    return i.get('DAL');
}

export const dalServiceProvider = {
    provide: DAL,
    useFactory: dalServiceFactory,
    deps: ['$injector']
};

app.module.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { UpgradeAdapter } from '@angular/upgrade';

@NgModule({
    imports: [
        BrowserModule,
    ],
    declarations: [],
    entryComponents: [],
    providers: [
    {
        provide: 'TestService',
        useFactory: ($injector: any) => $injector.get('testFactory'),
        deps: ['$injector']
    }]
})
export class AppModule {
    ngDoBootstrap() {}
}

//Upgrade any angularJS components we use from old project

let upgrade = new UpgradeAdapter(AppModule, null);

upgrade.upgradeNg1Provider('testFactory');

使用angularJS服务的角度服务：

"use strict";

export class DAL {
    get($q, $filter, $http, $log, IsoStringToDate, UnitConversion, $cookies, $uibModal, Utilities) {
        ... functions that do stuff ...
    }
}

(function() {

    var dal = function ($q, $filter, $http, $log, IsoStringToDate, UnitConversion, $cookies, $uibModal, Utilities) {
        var dalInst = new DAL();
        return dalInst.get($q, $filter, $http, $log, IsoStringToDate, UnitConversion, $cookies, $uibModal, Utilities);
    };

    angular
        .module('myWebApp')
        .factory('DAL', ['$q', '$filter', '$http', '$log','IsoStringToDate','UnitConversion','$cookies','$uibModal','Utilities', dal]);

}());

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

@Injectable()
export class TeamService {
    constructor(@Inject('TestService') testService: any) {
        console.log('TestService: ', testService.test());
    }
}

在your'retsconfig.json的

“compilerOptions”

属性下添加

“allowJs”：true

，或者通过命令行将

--allowJs

传递到

tsc

，以使TypeScript能够导入当前项目范围内的JavaScript依赖项

另一种方法是将.js文件重命名为.ts。与所有JavaScript一样，它也是有效的TypeScript。

在

“编译器选项”下添加
“allowJs”：true

您的属性是tsconfig.json文件或通过命令行将

--allowJs

传递到

tsc

，以启用TypeScript导入当前项目范围内的JavaScript依赖项

---

另一种方法是将.js文件重命名为.ts。与所有JavaScript一样，它也是有效的TypeScript。

不要将

与模块组合。它会造成伤害。只需使用

import

和

export

。我最初没有引用标记，但它与它和没有它的错误完全相同。我只是指出不应该使用它。您能否验证模块是否存在于相对路径中？请尝试使用

--allowJs

--allowJs！在我将其添加到tsconfig.json之后，它构建的很好。谢谢如果你想把它作为一个答案，我可以把它标记为正式答案。不要将

与模块结合。它会造成伤害。只需使用

import

和

export

。我最初没有引用标记，但它与它和没有它的错误完全相同。我只是指出不应该使用它。您能否验证模块是否存在于相对路径中？请尝试使用

--allowJs

--allowJs！在我将其添加到tsconfig.json之后，它构建的很好。谢谢如果你想把它作为一个答案，我可以把它标记为正式答案。