1

I want to convert Observable to User[].

After googling, I found a solution BUT, the conversion is done only inside map.

    users : User[] = [];

    this.userService.getUsersList() // Observable<Any>
          .map((listUsers: Array<any>) => {
           let result:Array<User> = [];
            if (listUsers) {
              listUsers.forEach((erg) => {
                result.push(new User(erg.id, erg.name, erg.username, erg.email, erg.password, erg.age, erg.active, erg.roles));
              });
            }
            console.log('----------------Size: ' + result.length);  // Output: 5 --> TRUE
            return result;
          })
          .subscribe(users => this.users = users);



     console.log('----------------Size: ' + result.length);        // Output: 0 --> FALSE

So it's Ok, I can get the size of the array User[] inside map. My problem is, how can I get the size or read the array User[] outside map.

Thanks in advance.

Bella
  • 27
  • 3
  • Possible duplicate of [How do I return the response from an Observable/http/async call in angular?](https://stackoverflow.com/questions/43055706/how-do-i-return-the-response-from-an-observable-http-async-call-in-angular) – Igor Jun 14 '19 at 14:33
  • Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/q/14220321/1260204) – Igor Jun 14 '19 at 14:33
  • `how can I get the size or read the array User[] outside map.` ← In the body of `subscribe` where you currently make the assignment. See the aforementioned [suggested duplicate](https://stackoverflow.com/q/14220321/1260204). Asynchronous calls are a common and critical building block in writing/designing an application. It is critical that you understand how to work with asynchronous calls in javascript, and by extension typescript. Understanding these core concepts will help you become a better programmer and also ensure you do not keep "stubbing your toe" on the same problem. – Igor Jun 14 '19 at 14:33
  • Thanks Sir @Igor for your reply. I'm a newbie with angular. Yes I knew that it's also OK inside subscribe. I'd got the same result outside map and subscribe and without ajax call. It's possibal ??. After googling, I can found a solution which is convert Observable to Array like described on this thread https://stackoverflow.com/questions/44940695/how-to-convert-observableany-to-array, but I got false result 0 as size. – Bella Jun 14 '19 at 15:01
  • It's 0 because the call back has not happened yet. Read the answer found in [How do I return the response from an asynchronous call?](https://stackoverflow.com/q/14220321/1260204). There is a great analogy to a phone call that should make this click for you. – Igor Jun 14 '19 at 15:24
  • Hello Sir @Igor, I can resolve the problem using localStorage.setItem. Could you please tell me if this way can cause some problem in the future. – Bella Jun 17 '19 at 12:30

1 Answers1

2

Try using promise.

Example on service file:

getList(id: number): Promise<any>
{
    return this.http.get(`${this.baseUrl}/../${id}`).toPromise();
}

then on your controller, try using async, wait and then.

Try refer to this thread

Saria Essid
  • 1,240
  • 1
  • 11
  • 16