Typescript Synchronize方法调用

时间:2017-12-12 07:13:57

标签: javascript angular typescript

Hello Nativescript Team,

我使用方法调用了。

请指导我如何在Nativescript + Angular中调用实现Sync Method。我的组件看起来像:

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");
}
}

我在控制台中获得的内容

[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

我需要输出方法同步调用:

Contructor()

中的第一个方法
        this.firstMethod();
        this.secondMethod();
        this.thirdMethod();
        this.fourthMethod();

Init

中的第二种方法
        this.firstInitMethod();
        this.secondInitMethod();
        this.thirdInitMethod();
        this.fourtInitMethod();

AfterInit中的第三种方法

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

1 个答案:

答案 0 :(得分:3)

You must return a promise or Observable to wait until method finishs it's 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 be 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 is asynchronize. Therefore you must use promise when you need using synchronize. Sorry for my English.