Код не работает после подписки из поста

Question

У меня есть service, который использует http post request для базы данных. Всякий раз, когда я использую это в моем .ts файле, ничего не происходит после того, как я подписываюсь на пост. Например, сообщение работает, но после console.log даже не выполняется.

login.ts

import { Component, OnInit } from '@angular/core';
import { NavController } from '@ionic/angular';
import { AuthService } from 'src/app/services/auth-services';
import { LoadingController } from '@ionic/angular';

@Component({
  selector: 'app-login',
  templateUrl: 'login.page.html',
  styleUrls: ['login.page.scss']
})
export class HomePage implements OnInit {

  constructor(
    public authService: AuthService,
    public navCtrl: NavController,
    public loadingCtrl: LoadingController,

  ) {}

  email = '';
  pw = '';

  ngOnInit() {
  }


   login() {
      this.authService.login(this.email, this.pw).subscribe(result => {
      console.log('Valid User');
      this.navCtrl.navigateForward('/menu/first/');
      },  error => {
          if (error.status === 401) {
            console.log('Authorisation Required');
          }
        }
      );
  } 
}

сервис

import { Injectable } from '@angular/core';
import { HttpClient} from '@angular/common/http';
import { NavController, AlertController } from '@ionic/angular';

import { Observable } from 'rxjs';

let apiUrl = 'http://ccoulter12.lampt.eeecs.qub.ac.uk/api/';

@Injectable({
  providedIn: 'root'
})
export class AuthService {
  constructor(
    private http: HttpClient,
    public navCtrl: NavController,
    public alertCtrl: AlertController,
    ) { }

login(emailin, pwin): Observable<any> {
    const data = {
      email: emailin,
      pw: pwin
    };
    return this.http.post<any>(apiUrl + 'login.php', JSON.stringify(data));
  }

}

Answer 1

На контроллере вы меняете функцию входа в систему:

            login() {
                this.authService.login(this.email, this.pw);
              }

В AuthService измените функцию входа в систему:

     apiUrl = 'http://ccoulter12.lampt.eeecs.qub.ac.uk/api/';

  login(emailin: string, pwin: string) {
    const data = {
      email: emailin,
      pw: pwin
    };
    this.http.post(this.apiUrl + 'login.php', JSON.stringify(data)).subscribe(result => {
      console.log('Valid User');
    }, error => {
      if (error.status === 401) {
        console.log('Authorisation Required');
      }
    }
    );
  }

В компоненте введите сервис и вызовите его метод, одновременно подписавшись на сервис непосредственно при запросе. Это решение отлично работает. Сервер вернул мне ошибку 403.

Если вы передадите параметры методу, укажите тип, если вы не знаете, укажите 'any'

Answer 2

Попробуйте это: -

login() {
  return this.authService.login(this.email, this.pw).subscribe({
    next(result) {
      this.presentLoading();
      // store jwt
      // move to dashboard
      console.log('Valid User');
      this.navCtrl.navigateForward('/menu/first/tabs/tab1');
    }, error(error) {
      if (error.status === 401) {
        console.log('Authorisation Required');
      }
    }
  });
}