我来自 NG1 环境，目前我正在创建具有所有可用功能的 NG2 应用程序。在提出这个问题之前，我正在探索 google 和 stackoverflow 的问题，但没有运气，因为 Angular 2 的 api 架构发展得如此之快，而且大多数答案都已经过时了。
我的情况：
我有带有属性用户的身份验证提供程序（服务），我想观察用户并在多个组件（导航栏、侧边栏等）中做出反应
我尝试过的：
@Injectable();
export class Auth {
private user;
authorized: EventEmitter<boolean>;
constructor(public router:Router){
this.authorized = new EventEmitter<boolean>();
}
login(user, token):void{
localStorage.setItem('jwt', token);
this.user = _.assign(user);
this.authorized.emit(<boolean>true);
this.router.parent.navigateByUrl('/');
}
}
/***************/
@Component({...})
export class NavComponent {
public isAuthroized: boolean = false;
constructor(Auth:Auth){
Auth.authorized
.subscribe((data) => this.onUserChanged(data));
}
onUserChanged(user){
alert('USER:' + user.email);
this.isAuthroized = true;
}
}
/****************/
bootstrap(AppComponent, [
ROUTER_PROVIDERS,
ELEMENT_PROBE_PROVIDERS,
HTTP_PROVIDERS,
MapLoader,
Auth
])
但没有运气。我应该使用 Observable EventEmitter 还是有其他正确的方法来处理这种情况？在 NG1 中，它就像在服务的属性上设置 $watch 一样简单。谢谢！
编辑：
我向 Auth 服务添加了新方法：
...
userUpdated: EventEmitter<boolean>;
constructor(public router:Router){
this.userUpdated = new EventEmitter<any>();
}
...
logout(returnUrl?: string): void{
delete this.user;
localStorage.removeItem('jwt');
this.userUpdated.emit(undefined);
if(!_.isEmpty(returnUrl)){
this.router.parent.navigateByUrl(returnUrl);
}
}
现在调用了事件，为什么这适用于注销而不适用于登录？
EDIT 2:
export class LoginPageComponent {
error: string;
constructor(public http: Http, public router: Router, public Auth:Auth){
}
login(event, email, password){
...
this.http.post('/api/login', loginModel, {headers: headers})
.map((res) => res.json())
.subscribe((res: any) => {
this.Auth.login(res.user, res.ADM_TOKEN);
}, (error) => this.error = error._body);
}
}
RESOLVED
愚蠢的错误..我把 NavComponent 留在了providers数组[Auth]中..所以它是与全局Auth不同的对象..对不起大家！希望这个问题能够帮助刚接触 Angular2 的人。谢谢你的努力。
