использовать сервис AngularJS для компонента Angular - PullRequest
0 голосов
/ 31 августа 2018

У меня есть служба AngularJS:

var id = 'authService';

angular.module('app')
    .service(id, ['$http', '$q', '$injector', 'storageSvc', 'notifyHub', 'sysSettings', '$rootScope', 'crudSvc', authService]);

и хотел бы использовать его внутри моего углового компонента SignInComponent:

import { Component, Inject } from '@angular/core';
import { Account } from '../../../../shared/models/account';
import { AuthService } from "../../../../shared/angularJS-upgraded-providers";

@Component({
  selector: 'sign-in',
  templateUrl: './sign-in.component.html'
})

export class SignInComponent {
  constructor(
    @Inject(AuthService) private authService: any) {
    this.authService = authService;
  }

  model = new Account('admin02', 'Admin@002', true);

  onLogin() {
    this.authService.login(this.model).then(response => {
      if (response != null) {
            alert("Seems it works");
      }
    });
  }
}

Для этого я создал файл angularJS-upgradeded provider.ts:

import { InjectionToken } from "@angular/core";
export const AuthService = new InjectionToken<any>('authService');

export function authServiceFactory(i: any) {
  return i.get('authService');
}

export const authServiceProvider = {
  provide: AuthService,
  useFactory: authServiceFactory,
  deps: ['$injector']
};

и пытается повторно использовать его внутри app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';

import { UpgradeModule } from '@angular/upgrade/static';
import { SignInComponent } from "./modules/login/components/sign-in/sign-in.component";
import { authServiceProvider } from './shared/angularJS-upgraded-providers';


@NgModule({
  declarations: [
    SignInComponent
  ],
  imports: [
    BrowserModule,
    UpgradeModule,
    FormsModule
  ],
  entryComponents: [
    SignInComponent
  ],
  providers: [authServiceProvider
  ],
  bootstrap: [SignInComponent]
})

export class AppModule {
  constructor(private upgrade: UpgradeModule) { }

  ngOnInit() {
    this.upgrade.bootstrap(document.body, ['app']);
  }
}

Мой стартовый файл - main.ts выглядит так:

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

Но когда я пытаюсь запустить мою программу, у меня появляется ошибка:

ERROR Error: Trying to get the AngularJS injector before it being set.
    at injectorFactory (static.js:690)
    at _callFactory (core.js:10956)
    at _createProviderInstance$1 (core.js:10910)
    at resolveNgModuleDep (core.js:10892)
    at _callFactory (core.js:10958)
    at _createProviderInstance$1 (core.js:10910)
    at resolveNgModuleDep (core.js:10892)
    at NgModuleRef_.push../node_modules/@angular/core/esm5/core.js.NgModuleRef_.get (core.js:12129)
    at resolveDep (core.js:12619)
    at createClass (core.js:12481)

Может кто-нибудь предоставить алгоритм или хотя бы дать представление о том, что я делаю неправильно и почему я получаю ошибку: Ошибка: Попытка получить инжектор AngularJS до того, как он будет установлен? Какой шаблон или шаблон я мог бы использовать, чтобы использовать службу AngularJS в моем приложении Angular5? Версия AngularJS: 1.6.8, Угловая версия: 5.2.11 Спасибо за ваше время

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...