I have an angular service that handles the retrieval of user objects. These user objects contain various attributes along with an array of walls. The service returns an observable to the component that calls it. While I am able to successfully create a user object from the JSON data obtained through the HTTP service within the service itself, I encounter an issue where the object returned is null when I subscribe to the service in my component. What could be causing this problem?
// user.ts
import { wall } from './wall';
export class user {
Id: number;
EntryType: number;
UserType: number;
SubscriptionType: number;
IsCoach: boolean;
Username: string;
Email: string;
Name: string;
Password: string;
Created: string;
MemberWalls: wall[];
}
//wall.ts
export class wall {
Title: string;
ViewItem_Id: number;
}
//authentication.service.ts
authenticate(authRequest: login): Observable<user> {
let url: string = this.apiUrl + AppSettings.LOGIN_SERVICE;
let headers = new Headers({
'Content-Type': AppSettings.CONTENT_TYPE_HEADER,
'client-secret': AppSettings.CLIENT_SECRET,
'client-id': AppSettings.CLIENT_ID
});
let options = new RequestOptions({ headers: headers });
return this._http.post(url, authRequest, options) //
.map(data => {
this.authenticated(data);
})
.catch(this.handleError);
}
private authenticated(res: Response) {
let body = res.json();
if (body.StatusCode === 200) {
localStorage.setItem('auth_token', res.headers.get("access-token"));
let user1: user = body.Data;
console.log(user1);
return body.Data || {};
}
else {
return {};
}
}
//login.component.ts
login() {
this.errorMessage = '';
this.currentUser = null;
this._authService.authenticate(this.loginModel)
.subscribe(user1 => this.currentUser = user1,
error => this.handleError( error));
}