如何在ES5中将升级后的Angular 1 service/factory注入Angular 2组件？

我有一个Angular1服务与名称，比如“为myService”如何在ES5中将升级后的Angular 1 service/factory注入Angular 2组件？

我然后使用Angular2 UpgradeAdapter这样的升级是：

var upgradeAdapter = new ng.upgrade.UpgradeAdapter(); 
upgradeAdapter.upgradeNg1Provider('myService');

现在我需要它注入到angular2组件。官方升级指南目前只有打字稿。在打字稿使用@Inject anotation与服务的叫法，像这样：

export class MyComponent { 
    constructor(@Inject('myService') service:MyService) { 
    ... 
    } 
}

什么是使用ES5名称注射服务的语法？

来源

2016-01-20 Dmitry Klochkov

要完成pixelbits的回答，你也需要的供应商名单中确定我的服务之一：

在应用水平

document.addEventListener('DOMContentLoaded', function() { 
    ng.platform.browser.bootstrap(Cmp, [MyService]); 
});

在组件级

var Cmp = ng.core. 
Component({ 
    selector: 'cmp', 
    providers: [ MyService ] 
}). 
(...) 
Class({ 
    constructor: [MyService, function(service) { 
    }] 
});

这取决于你想要做什么：共享你的服务实例在Angular2应用程序或每个组件的所有元素。

这个答案可以给出Angular2与ES5依赖注入的更多细节：Dependency Injection in Angular 2 with ES5。

编辑

其实，还有一个细微之处。在升级的情况下，您不需要使用ng.platform.browser.bootstrap函数进行引导，而是使用upgrade对象中的一个。

upgrade.bootstrap(document.body, ['heroApp']);

哪里heroApp是包含我想在Angular2应用程序中使用的服务和工厂Angular1模块。

实际上，当您在升级时调用upgradeNg1Provider方法时，相应的提供程序会在其关联的注入器中注册。这意味着你不需要按照上面的描述来指定它们。

所以，你只需要做到这一点，你要注入：

(...) 
Class({ 
    constructor: [ ng.core.Inject('customService'), 
       ng.core.Inject('customFactory'), 
       function(cService, cFactory) { 
    }] 
});

MISKO Hevery提供了极大的plunkr此：http://plnkr.co/edit/yMjghOFhFWuY8G1fVIEg?p=preview。

希望它可以帮助你，蒂埃里

来源

2016-01-20 13:21:29

谢谢您的回答。它看起来像按种类注射。但我实际上并没有MyService类/函数。服务声明如下：myModule.factory（'myService'，[function（）{...}]）。或者这个类/函数在升级过程中以某种方式创建？ –

我无法与Angular1工厂合作。我期望有这样的东西：'构造函数：[new ng.core.Inject（'customFactory'），function（cFactory）{（...）}]'。但我有以下错误：'没有customFactory的提供者！（class1 - > customFactory）'。实际上，我不知道应该将哪些内容放在提供程序列表（应用程序或组件级别）中。我用'ng.core.provide'函数做了一些尝试，但没有成功... –

我在Github中为此创建了一个问题：https：//github.com/angular/angular/issues/6588。 –

使用数组符号为服务的构造DI：

.Class({ 
    constructor: [MyService, function (service) { 
     ... 
}],

来源

2016-01-20 12:49:45 pixelbits

如何在ES5中将升级后的Angular 1 service/factory注入Angular 2组件？

回答

相关问题