1

我有一个非常大的混合 Angular 应用程序；原始应用程序是 angularjs 1.6.8，其余的是 Angular 7.2.15。我们正在努力将整个应用程序转换为 Angular，但进展缓慢。我们的应用程序还依赖于 angular-ui-bootstrap (2.5.0) / ngx-bootstrap (3.1.3)。

我们的每个重要视图都是延迟加载的，但登录页面除外。我目前正在尝试转换其中一种观点。

我们的 App 模块导入ModalModule.forRoot(). 在我尝试在降级服务中访问它之前，这很有效。例如，我有一个名为“Account”的路由，其中​​包含一个服务名称AccountModalService，并创建了这个降级：

import angular from 'angular';
import { downgradeInjectable } from '@angular/upgrade/static';
import { AccountModalService as service } from './accountModal.service';

angular.module('account').factory('AccountModalService', downgradeInjectable(service));

现在从我的 angularjsAccountPage我应该能够像这样打开一个模式

const accountPage = {
  controller: AccountPageCtrl,
  template: `<div><button ng-click="test()">Test</button></div>`
};

AccountPageCtrl.$inject = [
  'AccountModalService'
];
function AccountPageCtrl(AccountModalService) {
  this.test = function test() {
    AccountModalService.openTestModal(); // this would open my test modal
  };
}

angular.
  module('account').
  component('accountPage', accountPage);

我知道当openTestModal从 Angular 组件调用该方法时模态有效，但是当我尝试从 angularjs 组件启动它时。我得到错误

angular.js:14800 Error: StaticInjectorError(AppModule)[AccountModalService]: 
  StaticInjectorError(Platform: core)[AccountModalService]: 
    NullInjectorError: No provider for AccountModalService!

如果我更改AccountModalService为存在于根注入器上，像这样@Injectable({ provideIn: 'root' })，我会收到一个错误，表明注入器找不到模态要显示的组件：

angular.js:14800 Error: No component factory found for TestModalComponent. Did you add it to @NgModule.entryComponents?
    at noComponentFactoryError (core.js:9877)
    ...

这TestModalComponent是一个entryComponent延迟加载AccountModule的模块，该模块导入我急切加载的公共模块。但果然，不是TestModalComponent一个entryComponent。AppModule

如果我将我的测试模态组件和此服务移动到预先加载的代码中，它将正确打开模态。然而，这只是使预先加载的模块成为整体的第一步。这不是我想继续的模式，因为它使延迟加载的路由变得毫无价值。

有没有办法降级使用 ngx-bootstrap 模式的角度服务，以BsModalService在延迟加载的路线中显示来自 angularjs 代码的模式？有没有人成功做过类似的事情，愿意分享如何？

4

0 回答 0