title: Calling method on array entity and children in ReactiveX
body: <p>I want to create an observable from a tree. Each node will generate an observable which depends on the observable of its parent(e.g. via <code>switchMap</code>). At each level of the tree, the observables for each children needs to be merged.</p>
  
  <p>I want to convert this code so that it uses observables:</p>
  
  <pre><code>interface Request {
      name: string;
      childrens?: Request[];
  }
  
  start() {
    this.nextRequests(this.requests);
  }
  
  private nextRequests(requests: Requests[]) {
    requests.forEach(request =&gt; {
      this.socketService.message(request.name, (res) =&gt; {
        if (request.childrens) {
          this.nextRequests(request.childrens, res);
        }
      });
    });
  }
  
  </code></pre>
  
  <p>So this is what I thought it would look like:</p>
  
  <pre class="lang-js prettyprint-override"><code>interface Request {
      name: string;
      childrens?: Request[];
  }
  
  // This isn't right. 
  // SocketService.message return a observable, the reponse of the request.
  start(requests: Request[]): Observable&lt;any&gt; {
    return from(requests).pipe(switchMap(request =&gt; {
        return this.socketService.message(request.name);
      }), concatMap(request =&gt; {
      if (request.childrens) {
        return this.start(request.childrens);
      }
      return of(request.name);
    }));
  }
  
  const mock: Request[] = [
      {name: 'test1', childrens: [
          { name: 'test4' },
          { name: 'test5' }
      ]},
      { name: 'test2' },
      { name: 'test3' }
  ];
  
  this.start(mock).subscribe((name) =&gt; {
      console.log(`Request ${name} done`);
  }, err =&gt; { }, () =&gt; {
      console.log('Complete');
  });
  
  
  </code></pre>
  
  <p>And the output will should look like this:</p>
  
  <pre class="lang-js prettyprint-override"><code>Request test1 done
  Request test2 done
  Request test3 done
  Request test4 done
  Request test5 done
  
  Complete
  </code></pre>
  
  <p>But instead I get this:</p>
  
  <pre><code>Request test2 done
  Request test3 done
  Request test4 done
  Request test5 done
  </code></pre>
  
  <p>The order of emission between sibling nodes is not important. But parents with children are not printed(<code>test1</code>), and the complete callback is never executed. Why is that?</p>
  
  <p>Thanks!</p>