'angular value is undefined after refresh

I made a service module and wrote get function to get value

@Injectable()
export class CountrySelectorService {
  constructor(private storage: Storage) {
  }

  code: string;

  get currentCountryCode(): string {
    this.getCountryCode();
    console.log("code value before return");
    console.log(this.code);
    return this.code;
  }

  async getCountryCode(): Promise<void> {
    const countryCode = await this.loadFromStorage();
    console.log("loading");
    console.log(countryCode);
    this.code = countryCode;
  }

in first time I can get value like this

code value before return
countrySelector.service.ts:14 kr
countrySelector.service.ts:13 code value before return
countrySelector.service.ts:14 kr
countrySelector.service.ts:20 loading
countrySelector.service.ts:21 kr
countrySelector.service.ts:20 loading
countrySelector.service.ts:21 kr

but after refresh, I got undefined value

code value before return
countrySelector.service.ts:14 undefined
countrySelector.service.ts:13 code value before return
countrySelector.service.ts:14 undefined
countrySelector.service.ts:20 loading
countrySelector.service.ts:21 kr
countrySelector.service.ts:20 loading
countrySelector.service.ts:21 kr

I used storage module to keep value

private saveToStorage(countryCode: string): Promise<any> {
    return this.storage.set('country_code', countryCode);
  }

  private loadFromStorage(): Promise<string> {
    return this.storage.get('country_code').then(
      (value) => value ? value : ""
    ).catch(() => {
      "";
    });
  }

anyone knows about this problem>?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source