在 Angular 中获取 Observable 请求中的问题

Question

我有问题。

我有这些服务和这个电话：

    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))
    );
  }

这项服务在控制台中给我这个结果： console object

所以它有效

但是在组件中我无法解析并获取该对象也能够获取我需要的该对象中的数组 '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是对象上的数据Json json 是 https://reqres.in/api/users?page=2 所以我需要修复它，以便数组具有 'data' array

的数据

感谢大家^^

Answer 1

map((res) => {
  console.log('El servicio de usuarios funciona', res);         
})

因为你没有 return 语句，这隐含地 returning 未定义，所以你将可观察对象映射到仅发射 undefined.

我会切换到 tap，这样您就可以运行您的日志记录而无需更改通过管道的值。

tap((res) => {
  console.log('El servicio de usuarios funciona', res);         
})

或者，您可以保留 map 并添加 return res，尽管 map 运行的副作用并没有改变任何东西并不是真正的什么map 用于。

map((res) => {
  console.log('El servicio de usuarios funciona', res);   
  return res;      
})

在 Angular 中获取 Observable 请求中的问题

Problem in request get Observable in Angular

angular

rest

get

observable