how to execute methods in ngoninit one after another

Question

I have 4 methods in ngoninit two methods form getting data from api and other two are to load that data on page load example:

ngOnInit(){
getname();
getsubjects();
loadname(); 
loadsubjects();
}
/*this loadname to load reactive forms which is declared in constructor
when I am running this I am getting form value as empty If I put load name() in change or click then values are loading to the form am I missing something here conceptual wise anything or any suggestions ?*/

Answer 1

Answer

how to execute methods in ngoninit one after another

As @Optimal says, consider using concat() to do this in combination with what I suggest...

when I am running this I am getting form value as empty If I put load name() in change or click then values are loading to the form am I missing something here conceptual wise anything or any suggestions ?

Observables are used to communicate with backend api services using HTTP from Angular, as data arrives at the frontend asynchronously, and to "capture" this data as soon as it arrives you use subscribe()

Reference to the very clear and helpful Angular doc that explains this

My possible solution

ngOnInit() {

   // 'name' is captured as soon as it "arrives" from the api service
   // 'this.name' is the local (variable) destination of the requested data
   getname().subscribe(name => this.name = name)

   // same for subjects
   getsubjects().subscribe(subjects => this.subjects = subjects)

   // ...
}

should work but it depends on how you implemented the get() methods. If you can, please provide the full code for a better answer

---

I hope I was helpful, let me know how it goes! :)

Answer 2

You can use concat to run observables in order.

import { concat } from 'rxjs';


ngOnInit(): void {
    concat(getName(), getSubjects(), loadName(), loadSubjects())
    .subscribe();
}