Angular 订阅回复

Question

好的，我是 Angular 的新手，所以我遇到了这个小问题。所以我遵循 Angular 指南 (https://angular.io/guide/http)。所以我的问题是我的 http-response 总是未定义。在调试工具中，响应是：

{"code":0,"status":"error","message":"Invalid JWT - Authentication failed!"}

理应如此。但是当我控制台日志响应时，它总是说

This should be the response???:  undefined

profile.component.ts

import { Component, OnInit } from '@angular/core';
import { parse } from 'path';
import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import { getLocaleTimeFormat } from '@angular/common';
import { UserService } from '../user.service';
import { Config } from '../config';

@Component({
  selector: 'app-profile',
  templateUrl: './profile.component.html',
  styleUrls: ['./profile.component.css']
})

export class ProfileComponent implements OnInit {

  tmp: any;
  token: any;
  tmp2: any;
  config: Config;
  constructor(private userService: UserService, private router: Router,
    private http: HttpClient) { }

  ngOnInit() {


    this.token = localStorage.getItem('token');
    this.tmp = this.userService.checkToken(this.token)
      .subscribe((data: Config) => this.config = {
        code: data['code'],
        message: data['message']
      });

    console.log("This should be the response???: ", this.config);
  }

}

和 user.service.ts

import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { Response } from "@angular/http";
import { Observable } from "rxjs";
import 'rxjs/add/operator/map';
import { httpFactory } from '@angular/http/src/http_module';
import { Config } from './config';

@Injectable({
  providedIn: 'root'
})
export class UserService {


  config: Config;
  items: any;
  readonly url = 'http://localhost:82/phpangular/userSystem/src/api/userCtrl.php';


  constructor(private http: HttpClient, private router: Router) { }

  checkToken(token) {
   return this.http.post<Config>
   (this.url, {'data': 'checkToken', 'token': token});
  }


}

和我的界面config.ts

export interface Config {

    code: string;
    message: string;
}

如果有人能给我指点，我会很高兴:)

干杯

妮可

Answer 1

你的 console.log 应该在 subscribe 回调中

this.tmp = this.userService.checkToken(this.token).subscribe(
  data => {
    this.config = <Config>(data);
    console.log("This should be the response???: ", this.config);
  },
  err => {

  });

Angular 订阅回复

Angular subscribe response

response

subscribe

angular