我的 angular 代碼有這個問題，順便說一下，我在我的應用程式中使用了 angular 13。問題在于呼叫服務我試圖從后端呼叫用戶 api 并且一直面臨這個問題。我搜索了很多并嘗試了一切以使其正常作業，但沒有任何解決方案。這是下面的代碼： 這是用戶服務：
import { HttpClient, HttpResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { JwtHelperService } from '@auth0/angular-jwt';
import { environment } from 'src/environments/environment';
import { User } from "../module/user";
@Injectable({providedIn: 'root'})
export class UserService {
public apiUrl = environment.apiUrl;
private jwtHelper = new JwtHelperService();
constructor(private http: HttpClient) {}
login(user: User): Observable<HttpResponse<User>> {
return this.http.post<User>(`${this.apiUrl}/user/login`, user, { observe: 'response'});
}
register(user: User): Observable<HttpResponse<User>> {
return this.http.post<User>(`${this.apiUrl}/user/register`, user, { observe: 'response'});
}
updateUser(formData: FormData): Observable<User> {
return this.http.post<User>(`${this.apiUrl}/user/update`, formData);
}
deleteUser(username: string): Observable<any> {
return this.http.delete<any>(`${this.apiUrl}/user/delete/${username}`);
}
addUserToCache(user: User): void {
localStorage.setItem('user', JSON.stringify(user));
}
getUserFromCache(): User {
return JSON.parse(localStorage.getItem('user'));
}
addTokenToCache(token: string): void {
localStorage.setItem('token', token);
}
getTokenFromCache(): string {
return localStorage.getItem('token');
}
logOut(): void {
localStorage.removeItem('user');
localStorage.removeItem('token');
}
getTokenExpirationDate(): Date | null {
return this.jwtHelper.getTokenExpirationDate(this.getTokenFromCache());
}
isUserLoggedIn(): boolean {
if (this.getTokenFromCache() && this.getUserFromCache() &&
this.jwtHelper.decodeToken(this.getTokenFromCache()).sub &&
!this.jwtHelper.isTokenExpired(this.getTokenFromCache())) {
return true;
} else {
this.logOut();
return false;
}
}
createUserFormData(currentUsername: string, user: User): FormData {
const formData = new FormData();
formData.append('currentUsername', currentUsername);
formData.append('username', user.username);
formData.append('email', user.email);
formData.append('role', user.role);
formData.append('isActive', JSON.stringify(user.active));
formData.append('isNonLocked', JSON.stringify(user.notLocked));
return formData;
}
}
這是用戶資料
export class User {
constructor(
public id = 0,
public userId = '',
public username = '',
public email = '',
public lastLoginDate = null,
public logInDateDisplay = null,
public joinDate = null,
public active = true,
public notLocked = true,
public role = '',
public authorities = []) {}
}
這是向我顯示的錯誤：
Error: src/app/role/admin/admin.component.ts:15:22 - error TS2339: Property 'getAdmin' does not exist on type 'UserService'.
15 this.userService.getAdmin().subscribe(
~~~~~~~~
Error: src/app/role/admin/admin.component.ts:16:7 - error TS7006: Parameter 'data' implicitly has an 'any' type.
16 data => {
~~~~
Error: src/app/role/admin/admin.component.ts:19:7 - error TS7006: Parameter 'err' implicitly has an 'any' type.
19 err => {
~~~
Error: src/app/service/user.service.ts:36:23 - error TS2345: Argument of type 'string | null' is not assignable to parameter of type 'string'.
Type 'null' is not assignable to type 'string'.
36 return JSON.parse(localStorage.getItem('user'));
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error: src/app/service/user.service.ts:44:5 - error TS2322: Type 'string | null' is not assignable to type 'string'.
Type 'null' is not assignable to type 'string'.
44 return localStorage.getItem('token');
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
? Failed to compile.
? Browser application bundle generation complete.
5 unchanged chunks
Build at: 2021-11-29T07:19:50.781Z - Hash: 1847dd9fe6fe2628 - Time: 350ms
Error: src/app/role/admin/admin.component.ts:15:22 - error TS2339: Property 'getAdmin' does not exist on type 'UserService'.
15 this.userService.getAdmin().subscribe(
~~~~~~~~
Error: src/app/role/admin/admin.component.ts:16:7 - error TS7006: Parameter 'data' implicitly has an 'any' type.
16 data => {
~~~~
Error: src/app/role/admin/admin.component.ts:19:7 - error TS7006: Parameter 'err' implicitly has an 'any' type.
19 err => {
~~~
Error: src/app/service/user.service.ts:36:23 - error TS2345: Argument of type 'string | null' is not assignable to parameter of type 'string'.
Type 'null' is not assignable to type 'string'.
36 return JSON.parse(localStorage.getItem('user'));
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error: src/app/service/user.service.ts:44:5 - error TS2322: Type 'string | null' is not assignable to type 'string'.
Type 'null' is not assignable to type 'string'.
44 return localStorage.getItem('token');
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
? Failed to compile.
uj5u.com熱心網友回復：
服務中沒有函式呼叫
獲取管理員（）
在呼叫之前在服務中實作該功能。
uj5u.com熱心網友回復：
嘗試這個
return localStorage.getItem('token') || '';
這將僅解決 tsc 編譯器問題。
uj5u.com熱心網友回復：
這是正確的，當你從 localStorage 中獲取元素時，回傳型別為 null 或字串，
getItem(key: string): string | null;
在JSON.parse你必須確保專案存在并且你得到它之前，你不能決議空值
uj5u.com熱心網友回復：
嘗試使用 any 而不是 User 作為參考，這樣它將幫助您獲得一個物件
getUserFromCache(): any { return JSON.parse(localStorage.getItem('user')); }
請先在 UserService 類中撰寫 getAdmin() 函式以解決此問題
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/369125.html
標籤：javascript json 有角的 接口 休息