2016-06-13 12 views
0

マイmain.tsファイルには、次のようになります。私は、私はちょうど今all()の応答をハードコーディングしていますので、私のサービスにHTTPサービスを追加しようとした角2:エラー:Httpのプロバイダがありません! (AccountServiceの - > HTTP)

import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { enableProdMode } from '@angular/core'; 
import { HTTP_PROVIDERS } from '@angular/http' 
import { ClientDashboardTwoAppComponent, environment } from './app/'; 

if (environment.production) { 
    enableProdMode(); 
} 

bootstrap(ClientDashboardTwoAppComponent, [HTTP_PROVIDERS]); 

import { Injectable } from '@angular/core'; 
import { Http, Response } from '@angular/http' 

@Injectable() 
export class AccountService { 
    constructor(private http: Http) {} // <------------------ just added and it broke my tests 

    all() { 
    return Promise.resolve([ 
     { name: "Account 1" }, 
     { name: "Account 2" }, 
     { name: "Account 3" }, 
    ]); 
    } 

} 

しかし、このラインは、このサービスを使用してコンポーネントのテストを中断します(これらのスペックは角型cliジェネレータから来たもので、beforeEachProviders()AccountServiceプロバイダを追加したものです)。

import { 
    beforeEach, 
    beforeEachProviders, 
    describe, 
    expect, 
    it, 
    inject, 
} from '@angular/core/testing'; 
import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing'; 
import { Component } from '@angular/core'; 
import { By } from '@angular/platform-browser'; 
import { EngagementTableComponent } from './engagement-table.component'; 
import { AccountService } from '../account.service'; 

describe('Component: EngagementTable',() => { 
    let builder: TestComponentBuilder; 

    beforeEachProviders(() => [EngagementTableComponent, AccountService]); 
    beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) { 
    builder = tcb; 
    })); 

    it('should inject the component', inject([EngagementTableComponent], 
     (component: EngagementTableComponent) => { 
    expect(component).toBeTruthy(); 
    })); 

    it('should create the component', inject([],() => { 
    return builder.createAsync(EngagementTableComponentTestController) 
     .then((fixture: ComponentFixture<any>) => { 
     let query = fixture.debugElement.query(By.directive(EngagementTableComponent)); 
     expect(query).toBeTruthy(); 
     expect(query.componentInstance).toBeTruthy(); 
     }); 
    })); 
}); 

@Component({ 
    selector: 'test', 
    template: ` 
    <engagement-table></engagement-table> 
    `, 
    directives: [EngagementTableComponent] 
}) 
class EngagementTableComponentTestController { 
} 

ステップがありませんか?仕様に何かを注入する必要がありますか?

答えて

1

Http依存モジュールを正しくロードするためにに@angular/httpパッケージが追加されていることを確認してください。

"dependencies": { 
    ...., 
    "@angular/http": "2.0.0-rc.1", //<--add it in package.json 
    ...., 
    .... 
} 
+0

これはあります。 'コンストラクタ(プライベートhttp:Http){}'を取り除くと、それ以上は中断しません – Edmund

+0

タイスクリプトを使用していますか? –

+0

うん。それは何かを異ならせます – Edmund

関連する問題