这可能是初学者的问题,与了解为什么需要将服务注入组件有关。
1] 为什么我们需要将服务注入到每个组件中,而不是只创建静态方法并返回相同的输出,我们真的不需要为注入这些服务编写额外的代码吗?
假设我有一个像下面这样的认证服务:
import { Injectable } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/operator/map';
import { GlobalConfig } from "../global-config";
// Models
import { UserModel } from "../models/user-model";
@Injectable()
export class AuthenticationService {
constructor(private http: Http) { }
authenticate(user: UserModel): Observable<UserModel> {
let userObject = this.http.post(GlobalConfig.getUrlFor('authentication'), user)
.map((response: Response) => {
let responseJSON = response.json();
let userObj = <UserModel>{
UserId: responseJSON.UserId,
FirstName: responseJSON.FirstName,
LastName: responseJSON.LastName,
FullName: responseJSON.FullName,
Email: responseJSON.Email,
UserName: responseJSON.UserName,
Password: responseJSON.Password
};
return userObj;
});
return userObject;
}
}
在视图模型中,我会像这样使用它:
首先:注入服务
constructor(private authService: AuthenticationService) {}
第二步:调用它
login() {
this.authService.authenticate(this.user)
.subscribe(
p => {
GlobalConfig.baseUser = p;
localStorage.setItem('user', JSON.stringify(p));
this.router.navigate(['/dashboard']);
},
e => {console.log('Error has Occured:', e); }
);
}
但是如果我一开始就将身份验证服务中的认证方法设置为静态的,那么我只需要执行以下操作:
login() {
AuthenticationService.authenticate(this.user)
.subscribe(
p => {
GlobalConfig.baseUser = p;
localStorage.setItem('user', JSON.stringify(p));
this.router.navigate(['/dashboard']);
},
e => {console.log('Error has Occured:', e); }
);
}
我不需要注入或编写额外的必要工作。
我知道服务注入是一个已知的好习惯,但我真的不明白为什么。如果有人能更详细地解释一下,我会非常感激。