[英]my shareService in angular 2 send value work Properly but when i render my another components get default values
I'm trying to create a application with angular 2.
have an Userservice and when user signIn or singOut Im send a value to another components that say user is login or not and its worked properly i meaning data sending. 我正在尝试创建一个
angular 2.
的应用程序angular 2.
有一个Userservice,并且当用户signIn或singOut Im将值发送到另一个组件,该组件表示用户是否登录并且其工作正常时,这意味着发送数据。 my problem is Im have private property in another components with name islogin and with default value(false) that i subscribe my userService islogin...but when my components rendering default value again set. 我的问题是我在另一个名为islogin且具有默认值(false)的组件中拥有私有属性,我订阅了我的userService islogin ...但是当我的呈现默认值的组件再次设置时。 how to fix this?
如何解决这个问题? this is my codes:
这是我的代码:
***********************userService*********************************
@Injectable()
export class UserService {
private static _data: any;
isLogin$:Subject<boolean> = new Subject();
UserInfo$:Subject<any> = new Subject();
// Observable streams
CheckUser = this.isLogin$.asObservable();
userinfo = this.UserInfo$.asObservable();
constructor(private _util: UtilService) {
}
public signUp(data: any) {
return this._util.post('api/auth/register', data);
}
public signIn(data: any) {
var promise = this._util.post('api/auth/login', data);
promise.then(value => {
if (value.status == 0) {
UserService._data = value.result;
this.isLogin$.next(true);
this.UserInfo$.next(UserService._data);
}
});
return promise;
}
public signOut() {
var promise = this._util.post('api/auth/logout');
promise.then(value => {
if (value.status == 0) {
this.reset();
this.isLogin$.next(false);
this.UserInfo$.next(UserService._data);
}
});
return promise;
}
}
*********************someComponent like user profle********************
export class Profile extends Ext {
private isLogin:boolean;
private model ;
constructor(
private _router: Router,
private _routeParams: RouteParams,
private _seo: SEOService,
private _user: UserService)
{
super();
this._user.CheckUser.subscribe(val =>{
this.isLogin = val;
console.log(this.isLogin);
alert(val);
});
this._user.userinfo.subscribe(val => {
this.model = val;
alert(val);
});
}
}
and this is template for this component : 这是此组件的模板:
<div *ngIf="isLogin | async" class="container">
hiiiii {{model.name}}
</div>
what is my problem?! 我有什么问题?
The problem is that you use the async
pipe on something that isn't an observable (ie isLogin
) but a boolean property. 问题是您在不是可观察的对象(即
isLogin
)而是布尔属性的对象上使用了async
管道。
So either you use this: 因此,您可以使用以下命令:
<div *ngIf="isLogin" class="container">
hiiiii {{model.name}}
</div>
Either you update your component like this: 您可以像这样更新组件:
export class Profile extends Ext {
private isLogin:Observable<boolean>; // <-----
private model ;
constructor(
private _router: Router,
private _routeParams: RouteParams,
private _seo: SEOService,
private _user: UserService)
{
super();
this.isLogin = this._user.CheckUser; // <-----
(...)
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.