Why isn't my Promise fulfilling its purpose?

Having trouble with promises, I believe I grasp the concept but it's not functioning as expected in my project.

Here is a snippet of my code :

(I am working with TypeScript using Angular 2 and Ionic 2)

ngOnInit() {
  Promise.resolve(this.loadStatut()).then(() => this.testStatut());
}

testStatut() {
  if (this.admin !== undefined) {
    this.navCtrl.push(ConnectPage);
  } else {
    console.log("Undefined")
  }
}

admin;
loadStatut() {
  this.storage.get('admin').then((val) => {
    this.admin = val;
    console.log(this.admin)
  });
}

testStatut sends a response before loadStatut, whereas I require the opposite order.

I experimented with other functions and they worked as expected :

ngOnInit() {
  Promise.resolve(this.test1()).then(() => this.test2());
}

test1() {
  console.log("1")
}

test2() {
  console.log("2")
}

In this example, test1 precedes test2 execution orderly.

Answer №1

Here's the modified code for you to try out:

ngOnInit() {
  this.loadStatus().then(() => this.checkStatus());
}

checkStatus() {
  if (this.admin !== undefined) {
    this.navCtrl.push(ConnectPage);
  } else {
    console.log("Admin status is Undefined")
  }
}

admin;
loadStatus() {
  return this.storage.get('admin').then((val) => {
    this.admin = val;
    console.log(this.admin)
  });
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Why is the imported package not being recognized in the namespace declaration of my Node.js TypeScript file?

Currently, I am utilizing the WebStorm IDE developed by JetBrains to modify a TypeScript file within a Node.js v8.6.0 project. The JavaScript version set for this project is JSX Harmony. In the beginning of the TypeScript source file, there is an import st ...

Error message: "Function call failed in Angular model getter"

Here is the structure of my model: export class User { public username: string; private email: string; constructor() { this.username = undefined; this.email = undefined; } public getUsername(): string { return this.u ...

Determine in Typescript if a value is a string or not

In my code, I have a component: export type InputData = string | number | null; interface InputData { data?: string | number | null; validate: boolean; } const App: React.FC<InputData> = ({ data = '', validate = true, }) => ...

Having trouble getting the ng-bootstrap Rating component to function on Angular 6?

I'm attempting to utilize Angular 6, ng-bootstrap, and the Rating feature, but I'm encountering issues. Does anyone have a solution for properly implementing this rating functionality? NG-RATE Here is my code: facilitistatus.component.html &l ...

Tips for emphasizing the letters of the alphabet used in search functionality with Angular

Is there a way to highlight specific alphabets in the searched list instead of highlighting the entire word? Currently, when filtering the memberOffice and memberFacilities lists based on the alphabet entered in the search field, the entire text is highlig ...

Issue with action creator documentation not displaying comments

We are exploring the possibility of integrating redux-toolkit into our application, but I am facing an issue with displaying the documentation comments for our action creators. Here is our old code snippet: const ADD_NAME = 'ADD_NAME'; /** * Se ...

Having conflicting useEffects?

I often encounter this problem. When I chain useEffects to trigger after state changes, some of the useEffects in the chain have overlapping dependencies that cause them both to be triggered simultaneously instead of sequentially following a state change. ...

An error occurred due to attempting to access properties of null while trying to read 'useMemo' in a Next.js TypeScript application

Currently engaged in a Next.js 13 project with TypeScript, utilizing the useDrag hook. No errors are being flagged in my Visual Studio Code editor; however, upon attempting to render the page, an error message surfaces. The issue points to a problem with t ...

Issue: "The argument provided must be a specific string, not a string or an array of strings."

Currently, I am tackling a Vue project that incorporates TypeScript and axios for handling API requests. While working on the Reset Password component, the resetPassword function within the auth.ts file appears as follows: resetPassword(password1: string, ...

What are some strategies I can implement to effectively manage different errors and ensure the app does not crash

I came across a variety of solutions for error handling. The key concept revolves around this explanation: https://angular.io/api/core/ErrorHandler Attempts were made to implement it in order to capture TypeError, however, the outcome was not successful: ...

Executing test units in Angular

While setting up unit tests for my Angular app, I expect the ngInit function to be called. Component.ts: ngOnInit() { this.topToolBarService.change.subscribe(customer => { this.filter.customerid = customer; this.customerid = customer; ...

Developing a node module that includes nested subfolders

I'm currently working on an npm module and have the following index.ts file: export * from './src/A/index'; Right now, when importing in my app, it looks like this: import {something} from 'myModule'; Now, I want to enhance my ...

Encountering problem while exhibiting server's response message within a modal popup in Angular 6

I have implemented two custom dialog modals in an Angular component. The objective is to open the appropriate modal and display the response message. The component receives two values as Observables from my services: The name of the modal that needs to ...

Combining Angular and Material Design: matdrawer and mattoolbar creating an overlapping effect

I'm currently facing a challenge in trying to construct a drawer that includes a mattoolbar, intended to overlap the primary toolbar of my application. Despite my efforts, I have been unable to rearrange the drawer higher up in the component hierarch ...

Tips for ensuring your controls function properly and seamlessly when switching to another page

I utilized the instructions from this post to implement a slider. However, I encountered an issue with the controller when navigating to subsequent pages. While the controller functions correctly on the initial page, it duplicates the same values on the fo ...

Develop a variety of Jabber client echo bots

Hello Stackoverflow Community, I've been trying different approaches to resolve my issue, but I keep ending up with stack overflow errors. Programming Language: Typescript Main Objective: To create multiple instances of the Client Class that can be ...

Having an issue with displaying the country name and country code in a table using the Angular7 custom pipe

country code: "ab", "aa", "fr", ... I need to create a custom pipe that will convert a countryCode into a countryName, such as: "ab" → "Abkhazian", "ch" → "Chinese", "fr" ...

What is the best way to obtain user-inputted data from a dynamic input table with dynamically added rows?

I am struggling to fetch the user-entered data from a dynamic inputs table. Each time a new row is added dynamically to the table, I have to create a new array in the component.ts file to retrieve the data using Two-way data binding. Below is the HTML cod ...

Eliminate spacing in MaterialUi grids

As I work on a React project, I am faced with the task of displaying multiple cards with content on them. To achieve this layout, I have opted to use MaterialUi cards within Material UI grids. However, there seems to be an issue with excessive padding in t ...

Can we verify the availability of an Angular library during runtime?

I am in the process of creating a custom Angular library, let's name it libA, which has the capability to utilize another Angular library, named libB, for an optional feature. Essentially, if the Angular application does not include libB, then the fea ...