Angular 2.0.0 Metadata_resolver奇怪的行为

时间:2016-09-19 19:33:37

标签: angular

我正在将我的应用程序从angular2 RC5迁移到angular-webpack脚手架到角度为2 2.0.0且角度为cli beta 14。

我正在与这些错误作斗争:

  

未捕获错误:无法解析PublicInfoDao的所有参数:(?,   ?)。CompileMetadataResolver.getDependenciesMetadata @   metadata_resolver.js:508CompileMetadataResolver.getTypeMetadata @   metadata_resolver.js:405(匿名函数)@   metadata_resolver.js:552CompileMetadataResolver.getProvidersMetadata @   metadata_resolver.js:532CompileMetadataResolver.getNgModuleMetadata @   metadata_resolver.js:285RuntimeCompiler._compileComponents @   runtime_compiler.js:126RuntimeCompiler._compileModuleAndComponents @   runtime_compiler.js:64RuntimeCompiler.compileModuleAsync @   runtime_compiler.js:55PlatformRef _._ bootstrapModuleWithZone @   application_ref.js:303PlatformRef_.bootstrapModule @   application_ref.js:285(匿名函数)@   main.ts:13__webpack_require__ @ bootstrap db3609d ...:52(匿名   function)@。* $:7__webpack_require__ @ bootstrap   db3609d ...:52webpackJsonpCallback @ bootstrap db3609d ...:23(匿名   功能)@ main.bundle.js:1

  

metadata_resolver.js:278未捕获错误:意外值   'AppComponent'由模块'AppModule'声明(匿名函数)   @ metadata_resolver.js:278CompileMetadataResolver.getNgModuleMetadata   @ metadata_resolver.js:265RuntimeCompiler._compileComponents @   runtime_compiler.js:126RuntimeCompiler._compileModuleAndComponents @   runtime_compiler.js:64RuntimeCompiler.compileModuleAsync @   runtime_compiler.js:55PlatformRef _._ bootstrapModuleWithZone @   application_ref.js:303PlatformRef_.bootstrapModule @   application_ref.js:285(匿名函数)@   main.ts:13__webpack_require__ @ bootstrap db3609d ...:52(匿名   function)@。* $:7__webpack_require__ @ bootstrap   db3609d ...:52webpackJsonpCallback @ bootstrap db3609d ...:23(匿名   函数)@ main.bundle.js:1 1:   https://github.com/preboot/angular2-webpack

如果我移除应用程序的多个组件,这是一个奇怪的行为原因。但是,如果我添加一个简单的组件,如:

@Component({
  selector: 'tl-result-item',
  templateUrl: "./resultitem.component.html",
  styleUrls: ["./resultitem.component.scss"]
})
export class ResultItemComponent {

  @Input()
  result:Result;

  constructor(){}
}

抛出第二个错误。如果我评论@Input()该应用有效。 有一些服务,如果我取消注释应用程序会抛出相同的错误,如果我评论某些行错误消失。

我对这些错误感到疯狂。我认为这应该是一个外部问题。

有什么想法吗?

更新

第一个错误可能与https://github.com/AngularClass/angular2-webpack-starter#frequently-asked-questions有关(第二个问题) 我有几个问题要迁移到角度2.0.0 final。

UPDATE2:

@NgModule({
  providers: [
    MetaService,
    Title,
    HttpInterceptor,
    {provide: ConnectionBackend, useClass: XHRBackend},
    {provide: Http, useExisting: HttpInterceptor},
    {provide: Configuration, useClass: ConfigurationDevelopment}
  ],
  imports: [
    BrowserModule,
    HttpModule,
    FormsModule,
    ReactiveFormsModule,
    // APP_ROUTER_PROVIDERS
  ],
  declarations: [
    AppComponent,
    ResultItemComponent,

    TimestampToMomentPipe,
    TimestampToTimePipe
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

UPDATE3: 另一个在angular cli中失败的代码示例。

此代码正常运行:

this.publicService.all().subcribe(response => {
      console.log(response);
});

此代码失败:

this.publicService.all().subcribe(response => {
      deserialize(response)
});

上面解释的例外情况:

  

未捕获错误:无法解析PublicInfoDao的所有参数:(?,   ?)。

¿¿??

2 个答案:

答案 0 :(得分:1)

environment.ts

// Angular 2
// rc2 workaround
import { enableDebugTools, disableDebugTools } from '@angular/platform-browser';
import { enableProdMode, ApplicationRef } from '@angular/core';
// Environment Providers
let PROVIDERS: any[] = [
  // common env directives
];

// Angular debug tools in the dev console
// https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md
let _decorateModuleRef = function identity<T>(value: T): T { return value; };

if ('production' === ENV) {
  // Production
  disableDebugTools();
  enableProdMode();

  PROVIDERS = [
    ...PROVIDERS,
    // custom providers in production
  ];

} else {

  _decorateModuleRef = (modRef: any) => {
    const appRef = modRef.injector.get(ApplicationRef);
    const cmpRef = appRef.components[0];

    let _ng = (<any>window).ng;
    enableDebugTools(cmpRef);
    (<any>window).ng.probe = _ng.probe;
    (<any>window).ng.coreTokens = _ng.coreTokens;
    return modRef;
  };

  // Development
  PROVIDERS = [
    ...PROVIDERS,
    // custom providers in development
  ];

}

export const decorateModuleRef = _decorateModuleRef;

export const ENV_PROVIDERS = [
  ...PROVIDERS
];

app.module.ts

@NgModule({
  providers: [
 // expose our Services and Providers into Angular"s dependency injection
        ENV_PROVIDERS
  ],
  imports: [
    BrowserModule,
    HttpModule,
    FormsModule,
    ReactiveFormsModule,
    // APP_ROUTER_PROVIDERS
  ],
  declarations: [
    AppComponent,
    ResultItemComponent,

    TimestampToMomentPipe,
    TimestampToTimePipe
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

答案 1 :(得分:1)

也许你正在使用这样的出口桶:

export * from 'some-file';
export * from 'another-file';

在这种情况下,您可能遇到循环依赖,尽管源代码本身没有任何循环依赖。

有时是错误消息

  

无法解析所有参数(某些,东西,?)

表示您具有循环依赖关系。

您可以尝试通过直接指定所需文件来导入组件,而无需使用index.ts-files中捆绑的export-barrel

你可能想看看这个问题:

Barrel Import Appears To Break Load Order

...你的问题实际上可能与此问题重复: - )

Angular 2 DI Error - EXCEPTION: Can't resolve all parameters