どのように私はangular2の依存性注入を使用することができます

Question

これは私のAuthServiceです。どのようにしてこのすべてのコンポーネントでこの認証サービスを使用できますか？私はこのスクリプトを実行すると以下のエラーが表示されます - プロパティ 'userLoggedIn'がタイプ 'AuthService'に存在しません。

import { Component, Input, Inject, ReflectiveInjector, Injectable} from '@angular/core'; 
@Injectable() 
export class AuthService { 
    static userLoggedIn : boolean = false; 
    //call this function when login status changes 
    static changeLoginStatus(status: boolean){ 
     this.userLoggedIn = status; 
    } 
} 

コンポーネントファイル -

import { Component, OnInit, Inject, ReflectiveInjector } from '@angular/core'; 
import { FormGroup, FormBuilder, Validators, AbstractControl, FormControl } from '@angular/forms'; 
import { Http, Response, RequestOptions, Headers } from '@angular/http'; 
import {Observable} from 'rxjs/Rx'; 
import 'rxjs/add/operator/map'; 
//import './rxjs-operators'; 

import { CustomValidators } from '../common/validations.ts'; 
import { AuthService } from '../injectables/authservice.ts'; 

@Component({ 
    selector: 'app-login', 
    templateUrl: './login.component.html', 
    styleUrls: ['./login.component.css'] 
}) 
export class LoginComponent implements OnInit { 
    loginForm : FormGroup; 
    data : any; 
    //http : Http; 

    constructor(private http: Http, fb: FormBuilder) { 
    this.loginForm = fb.group({ 
     'email':[null, Validators.compose([Validators.required,CustomValidators.emailFormat])], 
     'password':[null, Validators.compose([Validators.required])], 
    }); 
    } 

    ngOnInit() { 

    } 

    submitLoginForm(value: any){ 
     console.log(value); 
     let headers = new Headers(); 
     headers.append('Content-Type', 'application/json'); 
     let body = JSON.stringify(value); 

     this.http.post(
     'http://192.168.1.90/articles/data/post/', 
     body) 
     .subscribe((res: Response) => { 
     this.data = JSON.stringify(res); 
     console.log('---->'+res.json().data.email); 
     localStorage.setItem('email', res.json().data.email); 
     localStorage.setItem('userID', res.json().data.id); 
     localStorage.setItem('name', res.json().data.name); 
     localStorage.setItem('loginStatus', 'true'); 
     //this.loginStatus = true; 
     //aService: AuthService; 
     AuthService.changeLoginStatus(true); 
     console.log('localstorege item ---->'+localStorage.getItem('email')); 
     }); 
     return false; 
    } 

} 

Answer 1

はあなた AuthService

export class AuthService { 
    userLoggedIn : boolean = false; 
    changeLoginStatus(status: boolean){ 
     this.userLoggedIn = status; 
    } 
} 

への依存性の注入は、あなたの constructorパラメータを介して動作変更

。

@NgModule({ 
    // ..... 
    providers: [ AuthService ] // <-- here 
    // ..... 
})