i have a problem .
I have these service and this call:
getUsers(): Observable<Users> {
this.spinner.show();
const options: Options = {
type: 'get',
path: '/users?page=2' ,
};
return this.apiCall.call(options).pipe(
map((res) => {
console.log('El servicio de usuarios funciona', res);
}),
finalize(() => {
this.spinner.hide();
}),
catchError((er) => this.apiCall.handleError(er))
);
}
this service gives me this result in console: console object
so it works
but in the component I can't resolve and obtain that object to be able to also take the array that is in that object i need 'allUsers' array
export class DashboardComponent implements OnInit {
stateForm: Props = new Props();
user?: SocialUser;
socialUser!: SocialUser;
loggedIn: boolean;
users: Users;
allUsers: UserBody[];
constructor(
private router: Router,
private authService2: SocialAuthService,
private authService: AuthService,
) { }
ngOnInit(): void {
this.initForm();
}
/**
* initForm
* initialize the form
*/
initForm(): void {
this.authService2.authState.subscribe((user) => {
this.user = user;
this.loggedIn = (user != null);
});
if (!this.user) {
this.user = JSON.parse(localStorage.getItem('user'));
}
this.getUsers();
// console.log(this.getUsers());
// this.users.data?.forEach(user => {
// this.allUsers.push(user);
// }
// )
}
getUsers(): void {
this.authService
.getUsers()
.pipe(
first(),
tap({
next: (userData) => {
},
error: () => {
this.stateForm.error = 'Invalid Login';
},
})
)
.subscribe( );
}
allUsers Model is the data on the object Json the json is https://reqres.in/api/users?page=2 so I need to fix it so that the array has the data of 'data' array
tahnks for all ^^
CodePudding user response:
map((res) => {
console.log('El servicio de usuarios funciona', res);
})
Since you don't have a return statement, this is implicitly returning undefined, and so you've mapped the observable into just emitting undefined
.
I would switch to tap
, so that you can run your logging without changing what values are going through the pipeline.
tap((res) => {
console.log('El servicio de usuarios funciona', res);
})
Alternatively, you could keep the map
and add return res
, though a map
that runs side effects and doesn't change anything is not really what map
is meant for.
map((res) => {
console.log('El servicio de usuarios funciona', res);
return res;
})