【发布时间】:2018-07-08 17:00:20
【问题描述】:
好的,我对 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;
}
如果有人给我指点,我会很高兴:)
干杯
- 尼可
【问题讨论】:
-
我们又来了。您会返回一个可观察的响应,而不是响应本身,因为 HTTP 调用是异步。调用 HttpClient 并订阅后,您只需 发送 请求。响应将在很久以后返回,此时,传递给 subscribe 的回调将被执行。因此,在您刚刚发送请求之后,响应当然是未定义的。将您的 console.log() 放入 subscribe 回调中。
标签: angular response subscribe