Kei*_*tto 389 angular2-di angular
我在Angular中构建了一个基本的应用程序,但是我遇到了一个奇怪的问题,我不能将服务注入到我的一个组件中.它注入了我创建的其他三个组件中的任何一个.
首先,这是服务:
import { Injectable } from '@angular/core';
@Injectable()
export class MobileService {
screenWidth: number;
screenHeight: number;
constructor() {
this.screenWidth = window.outerWidth;
this.screenHeight = window.outerHeight;
window.addEventListener("resize", this.onWindowResize.bind(this) )
}
onWindowResize(ev: Event) {
var win = (ev.currentTarget as Window);
this.screenWidth = win.outerWidth;
this.screenHeight = win.outerHeight;
}
}
它拒绝使用的组件:
import { Component, } from '@angular/core';
import { NgClass } from '@angular/common';
import { ROUTER_DIRECTIVES } from '@angular/router';
import {MobileService} from '../';
@Component({
moduleId: module.id,
selector: 'pm-header',
templateUrl: 'header.component.html',
styleUrls: ['header.component.css'],
directives: [ROUTER_DIRECTIVES, NgClass],
})
export class HeaderComponent {
mobileNav: boolean = false;
constructor(public ms: MobileService) {
console.log(ms);
}
}
我在浏览器控制台中遇到的错误是:
EXCEPTION:无法解析HeaderComponent的所有参数:(？).
我在bootstrap函数中有服务,所以它有一个提供程序.我似乎能够毫无问题地将它注入我的任何其他组件的构造函数中.
Gün*_*uer 419
从直接声明它的文件中导入它而不是桶.
我不知道究竟是什么导致了这个问题,但我看到它多次提到(可能是某种循环依赖).
它也应该通过改变桶中出口的顺序来修复(不知道细节,但也被提到)
J.P*_*rge 306
除了之前给出的答案之外,当您的注射服务缺少实际@Injectable()装饰器时,似乎也会抛出此错误.因此,在调试循环依赖项事项和导入/导出的顺序之前,请检查您的服务是否实际已@Injectable()定义.
这适用于当前的Angular最新版Angular 2.1.0.
Rea*_*lar 101
从Angular开始2.2.3,现在有一个forwardRef()实用程序函数,允许您注入尚未定义的提供程序.
未定义,我的意思是依赖注入映射不知道标识符.这是循环依赖期间发生的情况.您可以在Angular中使用非常难以解开和查看的循环依赖项.
export class HeaderComponent {
mobileNav: boolean = false;
constructor(@Inject(forwardRef(() => MobileService)) public ms: MobileService) {
console.log(ms);
}
}
@Inject(forwardRef(() => MobileService))在原始问题的源代码中添加构造函数的参数将解决问题.
J.M*_*SON 60
错误#1:遗忘装饰者:
//Uncaught Error: Can't resolve all parameters for MyFooService: (?).
export class MyFooService { ... }
错误#2:省略"@"符号:
//Uncaught Error: Can't resolve all parameters for MyFooService: (?).
Injectable()
export class MyFooService { ... }
错误#3:省略"()"符号:
//Uncaught Error: Can't resolve all parameters for TypeDecorator: (?).
@Injectable
export class MyFooService { ... }
错误#4:小写"i":
//Uncaught ReferenceError: injectable is not defined
@injectable
export class MyFooService { ... }
错误#5:你忘了: 从'@ angular/core'导入{Injectable};
//Uncaught ReferenceError: Injectable is not defined
@Injectable
export class MyFooService { ... }
正确:
@Injectable()
export class MyFooService { ... }
Mic*_*ael 25
如前所述,问题是由桶内的出口排序引起的,这是由循环依赖引起的.
更详细的解释如下:https://stackoverflow.com/a/37907696/893630
Hoc*_*eyJ 17
为了搜索者的利益; 我收到了这个错误.这只是一个缺失的@符号.
即产生Can't resolve all parameters for MyHttpService错误.
Injectable()
export class MyHttpService{
}
添加缺少的@符号可以修复它.
@Injectable()
export class MyHttpService{
}
如果您的服务A依赖于服务B的静态属性/方法而服务B本身依赖于服务A通过依赖注入,则会出现此错误.所以它是一种循环依赖,虽然它不是属性/方法是静态的.可能是与AOT结合发生的错误.
除了缺少@Injectable()装饰者
@Injectable()抽象类中缺少装饰器产生了无法解析服务的所有参数:(？)装饰器需要存在于MyService派生类中BaseService
//abstract class
@Injectable()
abstract class BaseService { ... }
//MyService
@Injectable()
export class MyService extends BaseService {
.....
}
在我的情况下,它发生是因为我没有声明构造函数参数的类型.
我有这样的事情:
constructor(private URL, private http: Http) { }
然后将其更改为下面的代码解决了我的问题.
constructor(private URL : string, private http: Http) {}
这个答案可能对这个问题非常有帮助。此外，就我而言，default原因是导出服务。
错误的：
@Inject()
export default class MobileService { ... }
正确的：
@Inject()
export class MobileService { ... }
另一个可能是没有emitDecoratorMetadata在tsconfig.json中将其设置为true
{
"compilerOptions": {
...
"emitDecoratorMetadata": true,
...
}
}
就我而言，这是因为插件 Augury，禁用它会正常工作。替代选项是 aot，也有效。
所有功劳都归功于@Boboss74，他在这里发布了答案：https : //github.com/angular/angular/issues/23958
| 归档时间： |
|
| 查看次数： |
303199 次 |
| 最近记录： |