Angular can't read http response header from nestjs

Question

I am using nestjs as a back end restAPI when I do a login request I send the JWT token to a custom header called 'x-auth' I can receive it on Postman header response PostMan Respoese

but in angular i cant read any headers while receiving the response and here is the response logged to the console Response To Console

my backend controller

@Post('login')
  public async userLogin(@Body() body: CreateUserDto, @Res() res: Response) {
    const token = await this.usersService.userLogin(body);
    return res.header({ 'x-auth': token }).send({ success: true }).status(200);
  }

and this is my angular auth service

const httpOption = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json' }),
  observe: 'response' as 'response',
};
@Injectable({
  providedIn: 'root',
})
export class AuthService {
  loginApi = `${environment.serverUrl}users/login`;

  constructor(private http: HttpClient) {}

  loginUser(login: any): Observable<any> {
    return this.http.post<any>(this.loginApi, login, httpOption);
  }
}

and my auth components

export class AuthComponent implements OnInit {

  subscription: Subscription;
  constructor(private service: AuthService, private router: Router) {}

  ngOnInit(): void {}

  onLogin(form: NgForm) {
    this.subscription = this.service.loginUser(form.value).subscribe((res) => {
      console.log(res);
    });
  }
}