Angular2 [Typescript]服务跨组件发生冲突

时间:2016-09-10 17:27:32

标签: angular typescript

我正在尝试将服务包含在3个组件中。 这是我的结构:

应用页

| - comp1

| - comp2

两个组件都显示在同一页面上 - >应用页面,其中一个在路由器插座中,另一个在外面。

public constructor(spinner: SpinnerService) {}

但是当我在两个组件中添加上面的代码时,我得到以下错误:

Error: BaseException@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:5116:27
CompileMetadataResolver</CompileMetadataResolver.prototype.getDependenciesMetadata@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:13527:23
CompileMetadataResolver</CompileMetadataResolver.prototype.getTypeMetadata@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:13424:25
CompileMetadataResolver</CompileMetadataResolver.prototype.getDirectiveMetadata@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:13176:27
CompileMetadataResolver</CompileMetadataResolver.prototype.getNgModuleMetadata/<@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:13267:47
CompileMetadataResolver</CompileMetadataResolver.prototype.getNgModuleMetadata@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:13261:21
RuntimeCompiler</RuntimeCompiler.prototype._compileComponents@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:15845:28
RuntimeCompiler</RuntimeCompiler.prototype._compileModuleAndComponents@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:15769:36
RuntimeCompiler</RuntimeCompiler.prototype.compileModuleAsync@http://localhost:9000/node_modules/@angular/compiler//bundles/compiler.umd.js:15746:20
PlatformRef_</PlatformRef_.prototype._bootstrapModuleWithZone@http://localhost:9000/node_modules/@angular/core//bundles/core.umd.js:9991:20
PlatformRef_</PlatformRef_.prototype.bootstrapModule@http://localhost:9000/node_modules/@angular/core//bundles/core.umd.js:9984:20
.execute@http://localhost:9000/build/boot.js:14:13
Zone</ZoneDelegate</ZoneDelegate.prototype.invoke@http://localhost:9000/node_modules/zone.js/dist/zone.js:323:20
Zone</Zone</Zone.prototype.run@http://localhost:9000/node_modules/zone.js/dist/zone.js:216:25
scheduleResolveOrReject/<@http://localhost:9000/node_modules/zone.js/dist/zone.js:571:53
Zone</ZoneDelegate</ZoneDelegate.prototype.invokeTask@http://localhost:9000/node_modules/zone.js/dist/zone.js:356:24
Zone</Zone</Zone.prototype.runTask@http://localhost:9000/node_modules/zone.js/dist/zone.js:256:29
drainMicroTaskQueue@http://localhost:9000/node_modules/zone.js/dist/zone.js:474:26
ZoneTask/this.invoke@http://localhost:9000/node_modules/zone.js/dist/zone.js:426:22

Error loading http://localhost:9000/build/boot.jslocalhost:9000:18:51

其中一个组件的源代码:

 import { Component } from '@angular/core';
 import {  LoaderModel } from '../../x/loader/core';
 import { SpinnerService } from '../../x/loader/service';


 declare var __moduleName: string;


 @Component({

  templateUrl: 'template.html',

  moduleId: __moduleName


 })

 export class AuthenticationComponent {



 public constructor(private _spinner: SpinnerService) {}



 Login() {

     this._spinner.start("LOL")

 alert("all Okies");

 }


 }

模块:

import { NgModule }                     from '@angular/core';
import { BrowserModule }                from '@angular/platform-browser';
import { routing, appRoutingProviders } from './routing';

import { axComponent }  from './core';
import { AuthenticationComponent }  from '../../x/authentication/core';
import { ForgotPasswordComponent }  from '../../x/credentials/forgot/password/core';
import { LoaderComponent }  from '../../x/loader/core';
import { SpinnerService } from '../../x/loader/service';


@NgModule({
  imports:      [ BrowserModule, routing ],
  declarations: [ alphaComponent, AuthenticationComponent, ForgotPasswordComponent, LoaderComponent ],
  providers:    [ appRoutingProviders, SpinnerService ],
  bootstrap:    [ axComponent ]
})
export class alphaModule {

}

当我从其中一个组件中删除它时,它将再次开始工作。

但我在两个组件上都需要它,对此有什么解决方案吗?

编辑:我检查了它没有rotuer-oulet并且两个组件都正常工作但是当你将其中一个添加到路由器插座时它会开始抛出错误。

Angular2方面是否存在错误?

0 个答案:

没有答案