Angular2.0電話服務

Question

我剛開始學習angular2.0。我已經使用了服務angular1.But我不知道我怎麼能在angular2 使用服務這是我component.html文件：

<form [ngFormModel]="loginForm" (click)="doLogin($event)"> 
    <input ngControl="email" type="email" placeholder="Your email" required> 
    <input ngControl="password" type="password" placeholder="Your password" required> 
    <button type="submit">Log in</button> 
</form> 

這是我的打字稿文件：

import {Component} from 'angular2/core'; 
import {FORM_DIRECTIVES,CORE_DIRECTIVES,FormBuilder, Validators,Control,ControlGroup } from 'angular2/common'; 
import { SampleService } from './sample.service'; 

@Component({ 
    selector: 'my-form', 

    templateUrl: 'app/form.component.html' 
    providers: [ 
    SampleService 
    ] 
}) 
export class FormComponent { 
    //loginForm: ControlGroup; 
    constructor(fb: FormBuilder) { 
    this.loginForm = new ControlGroup({ 
     email: new Control("", Validators.required), 
     password: new Control("", Validators.required) 
    }); 
    } 
    constructor(private _sampleService: SampleService){ 
    this._sampleService = _sampleService; 
    } 
    doLogin(event){ 
    this._sampleService.login() 
    .subscribe(
     data => /*this.countries = data, 
     error => this.error = "Region " + this.region + " is invalid."*/ 
     { 
     this.countries = data; 

     } 
    ); 
    } 

}; 

我有創建示例服務以獲取數據。

import { Hero } from './hero'; 
import { Injectable } from 'angular2/core'; 
import {Http} from 'angular2/http'; 
import 'rxjs/Rx'; 
import {AppSettings} from './appSettings'; 
@Injectable() 
export class SampleService { 

    constructor(http: Http){ 
    this.http = http; 
    } 

    login(data){ 
    return this.http.get(AppSettings.API_ENDPOINT+"oceania").map(res => res.json(), err => err); 

    } 
} 

錯誤是：

this._sampleService.login() is undefiend 

Answer 1

這個類有兩個構造函數，不支持。你需要將它們合併成一個

export class FormComponent { 
//loginForm: ControlGroup; 
    constructor(fb: FormBuilder) { 
    this.loginForm = new ControlGroup({ 
    email: new Control("", Validators.required), 
    password: new Control("", Validators.required) 
}); 
    } 
    constructor(private _sampleService: SampleService){ 
    this._sampleService = _sampleService; 
} 
    doLogin(event){ 
     this._sampleService.login() 
    .subscribe(
     data => /*this.countries = data, 
     error => this.error = "Region " + this.region + " is invalid."*/ 
     { 
     this.countries = data; 

     } 
    ); 
    } 

} 

像

export class FormComponent { 
//loginForm: ControlGroup; 
    constructor(fb: FormBuilder, private _sampleService: SampleService) { 
    this.loginForm = new ControlGroup({ 
     email: new Control("", Validators.required), 
     password: new Control("", Validators.required) 
    }); 
    } 

    doLogin(event) { 
    this._sampleService.login() 
    .subscribe(
     data => /*this.countries = data, 
     error => this.error = "Region " + this.region + " is invalid."*/ 
     { 
     this.countries = data; 

     }); 
    } 
} 

如果添加private或public的構造函數的參數，然後實例屬性也是這是多餘的和不必要的

constructor(private _sampleService: SampleService){ 
    this._sampleService = _sampleService; 
    } 

已經申報和分配給它的值

constructor(private _sampleService: SampleService){ 
    // this._sampleService = _sampleService; 
    } 

註釋掉的行會拋出，因爲沒有_sampleService變量，只有this._sampleSrevice。