Angular ngOnInit 관련 문제
2801 단어 typescriptjavascriptangular
ngOnInit가 생각대로 작동하지 않는 문제가 있습니다.
저는 Angular와 Observable을 사용하는 아직 초보입니다.
ngOnInit 메서드를 입력하는 구성 요소로 이동할 때 콘솔에서 볼 수 있습니다. 실행 중인 응답에 대한 구독의 console.info 문은 볼 수 없습니다.
구성 요소에 들어가면 페이지를 새로 고칠 수 있으며 구독에서 console.info 문을 볼 수 있습니다.
내 질문은 구성 요소를 처음 탐색할 때 왜 console.info 문이 표시되지 않습니까?
구성 요소 ngOnInit 메서드
ngOnInit(): void {
console.info('Entering ngOnInit - Home Component');
this.profile.getProfile().subscribe((resp) => {
this.currentUser = this.local.getObject(StorageItems.UserProfile) as IMSALUserProfile;
console.info('Current User: ', + JSON.stringify(this.currentUserInit));
});
}
이것이 내 서비스의 모습이며 MSAL을 사용하여 Azure Active Directory에서 사용자 프로필 정보를 가져오는 서비스입니다.
'@angular/common/http'에서 { HttpClient, HttpHeaders } 가져오기;
import { Injectable } from '@angular/core';
'./base.service'에서 { BaseService } 가져오기;
'@azure/msal-browser'에서 { AuthError } 가져오기;
'./logger.service'에서 { LoggerService } 가져오기;
import { Observable, of } from 'rxjs';
'../../shared/interfaces/msaluserprofile'에서 { IMSALUserProfile } 가져오기;
'./session.service'에서 { SessionService } 가져오기;
'../../shared/interfaces/enums/storage.model'에서 { StorageItems } 가져오기;
'./local-storage.service'에서 { LocalStorageService } 가져오기;
'./user.service'에서 { UserService } 가져오기;
'../../shared/interfaces/userinit'에서 { IUserInit } 가져오기;
@주사가능({
제공됨: '루트'
})
내보내기 클래스 UserProfileService 확장 BaseService {
현재 사용자!: IMSALUserProfile;
currentUserInit!: IUserInit;
생성자(비공개 http: HttpClient,
개인 로거: LoggerService,
개인 세션: SessionService,
개인 로컬: LocalStorageService,
개인 userInit: UserService) {
감독자();
}
공개 getProfile(): 관찰 가능 {
let sessionUser = this.session.getItem(StorageItems.UserProfile);
if (sessionUser.length !== 0) {
this.currentUser = JSON.parse(this.session.getItem(StorageItems.UserProfile));
}
let profile!: IMSALUserProfile;
if (this.currentUser) {
profile = this.currentUser as IMSALUserProfile;
} else {
this.http.get('https://graph.microsoft.com/v1.0/me')
.subscribe({
next: (profile) => {
profile = profile;
this.local.setItem(StorageItems.UserProfile, profile);
this.session.setItem(StorageItems.UserProfile, JSON.stringify(profile));
this.currentUser = profile as IMSALUserProfile;
},
error: (err: AuthError) => {
console.info('Authentication error');
}
})
}
this.local.setItem(StorageItems.UserProfile, profile);
this.session.setItem(StorageItems.UserProfile, JSON.stringify(profile));
return of(profile);
}
}
Reference
이 문제에 관하여(Angular ngOnInit 관련 문제), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/dmccolloughonegas/trouble-with-angular-ngoninit-10g3텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)