2017-02-06 7 views
3

Ich möchte eine Komponente in Angular2 machen, wo in einer Schleife von 50 Iterationen ausgeführt werden und ich möchte GET-Anfragen nur in den geraden Iterationen senden. Jetzt möchte ich senden synchrone GET-Anfragen so, dass, solange und bis Daten von der geraden Iteration nicht erhalten wird, sollte die Schleife warten und nicht die ungeraden Iteration eingeben. Irgendwelche Ideen, wie das gemacht werden kann?Synchrone GET-Anfragen in angular2

Hier ist die Funktion in den Dienst geschrieben - `

 getUser() { 
    for(let i = 1;i < 10;i++) { 
     if (i % 2 != 0) {   
     var resp =this.http.get('https://jsonplaceholder.typicode.com/users/'+i) 
      .map(res=> res.json()); 

     if(resp){ 
     resp.subscribe(res=>{ 
     console.log(res); 
     }); 
    } 

    } 
    else{ 
    console.log("even iteration"); 
    } 
} 

Hier ist das Output- And here's the output -

ich das Problem hoffen klar now.The Antworten in Ordnung und die auch Iteration Konsolmeldung kommen sollte sollte nur angezeigt werden, wenn sein ungerades Gegenstück das Objekt zurückgegeben hat. Bitte schlagen Sie eine Lösung vor.

+0

Das Synchronisieren von Anforderungen ist eines der schlimmsten Dinge, die Sie in einer Webanwendung tun können, und Angular selbst bietet keine Unterstützung. Sie können natürlich auch den normalen JS-Weg verwenden, um das zu tun, wenn Sie denken, dass Sie müssen. –

+0

Die Situation erfordert, dass ich das tue. Gibt es keine Möglichkeit, dies in angular2 zu erreichen? –

+0

Das hängt nicht mit Angular2 zusammen. Suchen Sie einfach in JavaScript, und machen Sie dasselbe in Angular. Und nein, es gibt keine Situation, die Sie dazu zwingen müssen. Es gibt vernünftige Wege, aber Sie müssten mehr Informationen über das Problem liefern, das Sie tatsächlich zu lösen versuchen. –

Antwort

1

Also mit Hilfe meiner Lehrer erreichten wir schließlich, was wir asynchrone Anfragen gesendet wanted.We und kehrte die Antworten als Observablen .Jetzt wir diese Observablen concatented, kehrte auf abgewechselt Schleifendurchläufe und erreicht die folgenden Output- output

Das ist mein Code-

service.ts -

getUser(i: number): Observable<any>{ 
    return this.http.get('https://jsonplaceholder.typicode.com/users/' + i) 
    .map(res => res.json()); 

} 

component.ts -

import {Component, OnInit} from '@angular/core'; 
import {AppService} from "./app.service"; 
import {Observable} from 'rxjs/Rx'; 

@Component({ 
selector: 'app', 
templateUrl: './app.component.html' 
}) 
export class AppComponent implements OnInit { 


    name:string; 
    call: Observable<any>; 

    constructor(private _service: AppService) {} 

    public ngOnInit() { 

    } 

    getUser(){ 
    this.call = Observable.concat(); 
    for(let i=1;i<=10;i++) { 
    if(i%2!=0){ 
     this.call = this.call.concat(this._service.getUser(i)); 
     } 
    else{ 
     this.call = this.call.concat(Observable.create(x=> {x.next(i)}).first()); 
     } 
    } 
     this.call.subscribe(res=>console.log(res)); 

    } 
    }