AppComponent.html:1 ERROR Error: No provider for GithubService

Question

我是 angular2 或编程新手。
我正在尝试使用 github api.

按用户名获取数据

下面是我的文件。

app.component.ts

import { Component } from '@angular/core';

import { ProfileComponent } from './components/profile.component';

@Component({
  selector: 'my-app',
  template: `<profile></profile>`,
})
export class AppComponent  { }

profile.component.ts

import {Component} from '@angular/core';

import {GithubService} from '../services/github.service';

@Component ({
    selector: 'profile',
    template: 'this is profilie page'
})

export class ProfileComponent{
    user: any;


    constructor(private _githubServie: GithubService){
        this._githubServie.getUser().subscribe(user => {
            console.log(user);
            this.user = user;
        })
    }
}

github.service.ts

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

import 'rxjs/add/operator/map';

@Injectable()

export class GithubService{

    private username: string;
    private client_id = "xxxxxxxxxxxxx";
    private client_secret = "xxxxxxxxxxxxxxxxxxxxxxxxx";

    constructor( private _http: Http){
        console.log("github service is ready");
        this.username = "graphicsmanoj";
    }

    getUser(){
        return this._http.get('http://api.github.com/users/'+this.username+'?client_id='+this.client_id+'&client_secret='+this.client_secret).map(res => res.json());
    }
}

非常感谢您的解决方案。

Answer 1

您应该在 AppModule 提供程序中注入服务。

app.module.ts 应该是这样的：

@NgModule({
  declarations: [
    // the components
],
  imports: [
    // the modules to import
  ],
  providers: [
    GithubService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 2

我犯了一个小错误。
我在 app.component.ts
中导入了 profile.component 应该是 GithubService

下面是修改后的 app.component.ts 文件

import { Component } from '@angular/core';

import { GithubService } from './services/github.service';

@Component({
  selector: 'my-app',
  template: `<profile></profile>`,
  providers: [GithubService]
})
export class AppComponent  { }

AppComponent.html:1 ERROR Error: No provider for GithubService

AppComponent.html:1 ERROR Error: No provider for GithubService

angular2-services

angular