Хорошо, позвольте мне попытаться обобщить как можно лучше. Я новичок в Angular, довольно тщательно искал, но не могу найти ответ на свою проблему:
Сейчас у меня есть: Api.Service.ts
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
const httpOptions = {
headers: new HttpHeaders({
'Accept': 'application/json',
'Content-Type': 'application/json'
})
};
@Injectable({ providedIn: 'root' })
export class TokenService {
private tokenUrl = 'http://urlofapi/auth/token';
constructor(private http: HttpClient) { }
addToken(): Observable<any> {
return this.http.post(this.tokenUrl, httpOptions);
}
}
api.component.ts
import { Component, OnInit } from '@angular/core';
import { TokenService } from '../api.service';
@Component({
selector: 'app-api',
templateUrl: './api.component.html',
styleUrls: ['./api.component.scss']
})
export class ApiComponent implements OnInit {
constructor(private tokenService: TokenService) { }
ngOnInit() {
this.tokenService.addToken().subscribe((data => {
this.data = data;
const finalToken = this.data['token'];
console.log(finalToken);
});
}
}
Токен возвращается из API через рукопожатие POST. Он возвращается в формате:
{
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJVVUlEIjoiYTM3YWFmNzAtZjU0Yy00MGMwLWEwZGUtOTE4NTBkNjY1ODI2IiwiZGV2aWNlSWQiOiIxMjIzMzMiLCJleHBpcmVzQXQiOiIyMDE4LTExLTI5VDIwOjI4OjM3WiJ9.VcTt_TJWFA58iBCDS0JnTAJkH9EzU15QES9k0vI84Ic"
}
Я регистрирую токен на консоли, поэтому я знаю, что он определяет и получает его.
Итак, моя проблема Я получаю токен, он устанавливается как finalToken, он регистрируется в консоли. Проблема в том, что по какой-то причине эта переменная не видна ни в одном из остальных приложений.
поэтому, если я попытаюсь вызвать его из любого места за пределами оболочки ngOnInit() {}, он вернется как неопределенный.
For instance, if I want to print it to screen in my api.component.html by using:
{{ finalToken }}
in browser, I get:<p _ngcontent-c1=""></p>
без ошибок, но не тянет переменную
Так что ОЧЕНЬ tl:dr; Можно ли сделать const finalToken доступным по всему миру? Мне нужно будет отправить его в заголовке любых дополнительных запросов к API, но сейчас я даже не могу получить к нему доступ в HTML компонента, в котором он находится.