2016-09-14 1 views
0

Angular2/ionic2로 작성된 내 응용 프로그램의 로컬 저장소에서 데이터를 비동기로 검색하는 것을 처리하는 데 어려움을 겪고 있습니다.this.storage.get() 호출에서 비동기식 약속을 처리 할 수있는 체인 연결

는 다음과 내가 가진 코드가 될 때 :

request(args) { 
 
    var headers = new Headers(); 
 
    headers.append('Content-Type', 'application/json'); 
 

 
    // Retrieve the token from the local storage, if available 
 
    this.storage.get('token').then((value) => { 
 
     headers.append('Authorization', 'Token ' + value); 
 
    }); 
 

 
    args = args || {}; 
 

 
    var url = this.API_URL + args.url; 
 
    var method = args.method; 
 
    var data = args.data || {}; 
 

 
    var options = new RequestOptions({headers: headers, withCredentials: this.use_session}); 
 

 
    return new Promise((resolve,reject) => { 
 

 
     if (method == 'GET') { 
 
     this.http.get(url, options) 
 
      .map(res => res.text()) 
 
      .subscribe(
 
      (data:any) => { 
 
       resolve(data); 
 
      }, 
 
      (err:any) => { 
 
       data = {}; 
 
       data['status'] = 0; 
 
       data['non_field_errors'] = ["Could not connect to server. Please try again."]; 
 
       data['error'] = err; 
 
       reject(); 
 
      }, 
 
      () => { 
 
      } 
 
     ); 
 
     } 
 
    }); 
 
    }

요청 함수를 호출하는 코드 다음과 같습니다

authenticationStatus(){ 
 
    return this.request({ 
 
     'method': "GET", 
 
     'url': "/user/" 
 
     }) 
 
     .then((data:any) => { 
 
      console.log('****** authenticationStatus: GET /user/ SUCCESS'); 
 
     }); 
 
    }

그리고이 차례로 다음과 같이 호출됩니다

 this.djangoAuth.authenticationStatus() 
 
     .then((data:any) => { 
 
      this.loggedIn = true; 
 
      this.enableMenu(true); 
 
      this.root = PhotoPage; 
 
      }, 
 
      (err:any)=>{ 
 
      this.loggedIn = false; 
 
      this.enableMenu(false); 
 
      this.root = LoginPage; 
 
      });

내 머리의 주위 중첩 약속을 포장 어려움이 위의 코드를 수정하는 방법을 작동하지 않을 수 있도록 this.storage.get("token") 호출의 결과 아래 코드에서 사용하기 전에 헤더에 데이터를 추가했습니다. 저는 약속을 어떤 식 으로든 연결해야한다고 생각하지만 정확히 어떻게 작동 할 수는 없습니다.

+0

기본 로컬 스토리지에 액세스 else 부분을 추가 할 수도있다 동기 ... 확실하지 왜 당신 약속에 싸여 있습니다 – charlietfl

+1

이것은 네이티브가 아니며 angularjs/ionic입니다 –

+0

둘 다 기본 자바 스크립트를 사용하는 프레임 워크입니다 – charlietfl

답변

1

네, 두 가지 약속을 연결해야합니다. 실제로는 쉽습니다. 당신이해야 할 일은 첫 번째 약속 then() 방법으로 전달하는 콜백에서 두 번째 약속을 반환하는 것입니다.

당신은 (I 별도의 기능에 헤더를 추가하는 코드를 이동 - 나는 그것을 그런 식으로 더 읽을 생각)과 같은 코드를 다시 작성할 수 있습니다

이 모든에서 가장 어려운 일이 아닌 모든 잊지하는 것입니다

// returns a promise that resolves to headers 
createHeaders() { 
    var headers = new Headers(); 
    headers.append('Content-Type', 'application/json'); 

    // Retrieve the token from the local storage, if available 
    return this.storage.get('token').then((value) => { 
    headers.append('Authorization', 'Token ' + value); 
    return headers; 
    }); 
} 

request(args) { 

    return this.createHeaders().then(headers => { 
    args = args || {}; 

    var url = this.API_URL + args.url; 
    var method = args.method; 
    var data = args.data || {}; 

    var options = new RequestOptions({headers: headers, withCredentials: this.use_session}); 

    return new Promise((resolve,reject) => { 

     if (method == 'GET') { 
     this.http.get(url, options) 
      .map(res => res.text()) 
      .subscribe(
      (data:any) => { 
       resolve(data); 
      }, 
      (err:any) => { 
       data = {}; 
       data['status'] = 0; 
       data['non_field_errors'] = ["Could not connect to server. Please try again."]; 
       data['error'] = err; 
       reject(); 
      }, 
      () => { 
      } 
     ); 
     } 
    }); 
    }); 
} 

을 각 필요한 return.

또한, 나는 눈치 당신의 PromiseGET 이외의 방법을 받으면 완료되지 않습니다 - 당신이 reject

if (method == 'GET') { 
    .... 
} else { 
    reject(new Error('invalid method:' + method)); 
} 
+0

입니다. 문제가있는 것 같습니다. args의 범위 지정. 이 코드는 args.url과 args.method를 사용하는 줄에 쓰인다. –

+0

어떤 차이가 나는 경우 Typescript를 사용하고 있습니다. –

+0

예, '이'에 대해 잊어 버렸습니다. createHeaders()를 호출 할 때 필요합니다. 콜백 내부에서 필요합니다. (그래서'function'을'=>'으로 변경했습니다.) 결정된. – artem