Question

我如何进行同步http调用，我有2个共享服务来进行调用，首先是获取所有数据，然后执行ngFor来渲染项目说按钮。

共享服务

getOrderId(id) {
    return this.http.get('www.site.com/api/Order/' + id)
      .map(res => res.json());
  }
getOriginSite () {
    return this.http.get('www.site.com/api/Orders?originSite=2')
      .map(res => res.json());
  }

首先在getOrdersFromOrigin()

中调用ngOnInit

getItemOrigin() {
        this.sharedService.getOriginSite ()
          .subscribe(data => {
            this.itemPrepare= data.Results;
          })
      }

    <div *ngFor="let prepare of itemPrepare">
      <button class="btn btn-success" (click)="getOrderId(prepare.Id); modal.open();">{{ prepare.Id }}</button> <br/><br/>

     <modal #modal>
      <modal-body>
            <p>{{ customerName }}</p>
      </modal-body>
      <modal-footer>
         <button (click)="modal.close()" type="button" class="btn btn-danger">Close</button>
         <button class="btn btn-primary" (click)="updateOrder(prepare.Id)">It's Ready</button>
       </modal-footer>
      </modal>
    </div>

这会在UI中创建按钮然后当我点击它调用另一个API时，这也会在上面的模态中显示一些数据，但是它必须等待几秒才能显示，因为它必须等待调用完成。当我将this.currentOrderJosn传递给undefined时，这也会导致updateOrder()成为getItemJson(id) { this.sharedService.getOrderId(id) .subscribe(data => { // Use this data for the POST this.currentOrderJson = data; this.customerName = data.Results.Customer.FirstName; }) } updateItemJSON(id) { // Returns as undefined console.log(this.currentOrderJson) }。

this.currentOrderJSON()

那么如何让这些调用保持同步，这样就不必等待几秒钟来显示数据，因此我可以在updateOrder()中使用<?php include('connect.php'); define( 'API_ACCESS_KEY', 'AIzaSyBahgRuILBYJXXXXXXXXXXXXXXXXXX' ); $sql=$mysqli->query("SELECT * FROM subscribe_users where id= '17'"); $registrationIds=array(); while($row=$sql->fetch_assoc()){ $registrationIds[] = $row['registration_id']; } $ids=json_encode($registrationIds); //echo $ids; $fields = array('registration_ids' => $registrationIds); //var_dump($fields); $headers = array('Authorization: key='. API_ACCESS_KEY,'Content-Type: application/json'); //var_dump($headers); $ch = curl_init(); curl_setopt( $ch,CURLOPT_URL, 'https://fcm.googleapis.com/fcm/send' ); curl_setopt( $ch,CURLOPT_POST, true ); curl_setopt( $ch,CURLOPT_HTTPHEADER, $headers ); curl_setopt( $ch,CURLOPT_RETURNTRANSFER, true ); curl_setopt( $ch,CURLOPT_SSL_VERIFYPEER, false ); curl_setopt( $ch,CURLOPT_POSTFIELDS, json_encode( $fields ) ); $result = curl_exec($ch ); curl_close( $ch ); echo $result;。

Answer 1

  getOrderId(id) {
    return this.preparedOrderId = this.http.get('www.site.com/api/Order/' + id)
      .map(res => res.json())
      .toPromise();
  }

(click)="getOrderClickHandler(id)"

getOrderClickHandler() {
  getOrderId(id).then(id => updateOrder(id))
}

或

getOrderId(id) {
    this.http.get('www.site.com/api/Order/' + id)
      .map(res => res.json())
      .subscribe(val => this.preparedOrderId = val);
  }

(click)="updateOrder(prepare.Id)"

虽然后者假定您无法在从服务器获取响应所需的时间内关闭对话框。对于前者，这种情况不可能发生，因为它已被正确链接，并且在{id}不可用之前不会被updateOrder()调用。

从函数A获取JSON并将其传递给angular2

1 个答案: