Typescript Synchronize method calling

Question

Hello Nativescript Team,

I am mashed up with the method calling.

Could please guide me How can I implement Sync Method calling in Nativescript + Angular

import { Component, OnInit, AfterContentInit } from "@angular/core";

@Component({
    selector: "Home",
    moduleId: module.id,
    templateUrl: "./home.component.html",
    styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit, AfterContentInit {

constructor() {
    this.firstMethod();
    this.secondMethod();
    this.thirdMethod();
    this.fourthMethod();
}

ngOnInit(): void {
    this.firstInitMethod();
    this.secondInitMethod();
    this.thirdInitMethod();
    this.fourtInitMethod();
}

private firstInitMethod() {
    console.log("1 ::::: firstInitMethod method");
}

private secondInitMethod() {
    console.log("2 ::::: secondInitMethod method");
}

private thirdInitMethod() {
    console.log("3 ::::: thirdInitMethod method");
}

private fourtInitMethod() {
    console.log("4 ::::: fourtInithMethod method");
}


private firstMethod() {
    console.log("1 ::::: First method");
}

private secondMethod() {
    console.log("2 ::::: second method");
}

private thirdMethod() {
    console.log("3 ::::: third method");
}

private fourthMethod() {
    console.log("4 ::::: fourth method");
}


ngAfterContentInit() {
    console.log("ngaftercontnet init method called");
    this.firstAfterInitMethod();
    this.secondAfterInitMethod();
    this.thirdAfterInitMethod();
    this.fourthAfterInitMethod();
}


private firstAfterInitMethod() {
    console.log("1 ::::: firstAfterInitMethod method");
}

private secondAfterInitMethod() {
    console.log("2 ::::: secondAfterInitMethod method");
}

private thirdAfterInitMethod() {
    console.log("3 ::::: thirdAfterInitMethod method");
}

private fourthAfterInitMethod() {
    console.log("4 ::::: fourthAfterInitMethod method");
}

output result:

[My Phone 5508]: 1 ::::: First method
[My Phone 5508]: 2 ::::: secondInitMethod method
[My Phone 5508]: 3 ::::: thirdInitMethod method
[My Phone 5508]: 3 ::::: third method
[My Phone 5508]: 2 ::::: second method
[My Phone 5508]: 4 ::::: fourtInithMethod method
[My Phone 5508]: 4 ::::: fourth method
[My Phone 5508]: ngaftercontnet init method called
[My Phone 5508]: 1 ::::: firstAfterInitMethod method
[My Phone 5508]: 2 ::::: secondAfterInitMethod method
[My Phone 5508]: 1 ::::: firstInitMethod method
[My Phone 5508]: 3 ::::: thirdAfterInitMethod method
[My Phone 5508]: 4 ::::: fourthAfterInitMethod method

I need Output method sync calling :

First methods in Contructor()

        this.firstMethod();
        this.secondMethod();
        this.thirdMethod();
        this.fourthMethod();
Second methods in Init

        this.firstInitMethod();
        this.secondInitMethod();
        this.thirdInitMethod();
        this.fourtInitMethod();
Third methods in AfterInit

        this.firstAfterInitMethod();
        this.secondAfterInitMethod();
        this.thirdAfterInitMethod();
        this.fourthAfterInitMethod();

I'm not sure what your question is, could you rephrase it ? Otherwise, I advise you to take a look at the Angular lifecycle to understand how it works — user4676340
– user4676340, Commented Dec 12, 2017 at 7:16
Well you are calling these methods in OnInit and constructor, so this is expected. If you want all to run in sequence then add all in OnInit. Then these will run in sequence, if these are not actually async. — AVJT82
– AVJT82, Commented Dec 14, 2017 at 6:23
@AT82 is it? His firstInitMethod is the last of the methods in ngOnInit to run, so, there should be sincronization inside ngOnInit? — Student
– Student, Commented Nov 13, 2021 at 21:52

Student · Accepted Answer · 2021-11-13 21:48:53Z

7

You must return a Promise or Observable to wait until method finishes its process.

Such as:

private firstAfterInitMethod() {
  return new Promise((resolve, reject) => {
    console.log("1 ::::: firstAfterInitMethod method");
    // resolve("something"); when you want to return something.
  });
}

Other methods must return Promise in your case like firstAfterInitMethod().

You must call firstAfterInitMethod like this:

this.firstAfterInitMethod().then((resolve:any) => {
  // now you can call secondAfterInitMethod();
});

Note: TypeScript and JavaScript are asynchronous. Therefore, you must use Promise when you need to do some synchronized work.

edited Nov 13, 2021 at 21:48

Student

28.6k70 gold badges168 silver badges268 bronze badges

answered Dec 30, 2017 at 13:57

Yakupas

965 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Typescript Synchronize method calling

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related