ответ на запрос, не являющийся тем же самым при доступе в subsrcibe

Question

У меня есть угловая функция, которая делает HTTP-вызов к определенной конечной точке, и я подписываюсь на ответ.Но есть очень странное поведение, когда я замечаю, что когда я проверяю ответ на запрос на вкладке сети, это правильно, но когда я вижу тот же самый ответ на тот же самый запрос в консоли от console.log, он отличается.Вот моя угловая функция, которая делает запрос и подписывает ответ.

getTemplate(){
    this.documentService.getDocumentTemplates({}, this.template_uuid)
      .subscribe((response) => {
        console.log('response');
        console.log(response);
        this.questionsarray = response['questions'];
        let i = 0;
        for (const section  of this.questionsarray) {
          for (const question of section.questions) {
            this.questionsarray[i] = question;
            i++;
          }
        }
        if(this.action === 'edit'){
          this.getContract(this.contractUUID);
        }
    });
  }

и ниже - скриншот вкладки сети

, а ниже - скриншотof console.log

Я не могу найти свою ошибку, любая помощь приветствуется.Спасибо.

Редактировать: это моя сервисная функция.

getDocumentTemplates(data: Object = null, uuid) {
    return this.httpService.httpRequestConsumerWithUUID({
        method: 'GET',
        url: '/agbuilder/template/' + uuid + '/',
        data: data
    });
  }

и это мой сервис http warpper, который в конечном итоге делает запросы и возвращает ответ.

@Injectable()
export class HttpService {

  baseUrl: string = environment.serverUri;
  onError: EventEmitter<string> = new EventEmitter<string>();

  constructor(
    private http: Http,
    public router: Router,
    private cookieService: CookieService
    ) {
  }

  // for auth(login, signup and profile) where it will use accounts api+server token
  httpRequest(requestObject: any) {
    const request = this.requestBuilder(requestObject, 'server');
    return this.MakeRequest(request);
  }

  // this will use consumer token with uuid in url
  httpRequestConsumerWithUUID(requestObject: any) {
    const request = this.requestBuilder(requestObject, 'consumer-uuid');
    return this.MakeRequest(request);
  }

  // this will use consumer token WITHOUT uuid in url
  httpRequestConsumer(requestObject: any) {
    const request = this.requestBuilder(requestObject, 'consumer');
    return this.MakeRequest(request);
  }

  MakeRequest(request: any) {
    return this.http.request(request)
      .map(response => {

        if (response.status === 204) {

          return Object.assign({'status': 'success'}, {
            serverUri: environment.serverUri
          });
        }

        return Object.assign(response.json(), {
          serverUri: environment.serverUri
        });
      })
      .catch((err) => this.handleError(err));
  }


  // httpRequest(requestObject: any) {

  //   const request = this.requestBuilder(requestObject);
  //   return this.http.request(request)
  //     .map(response => {

  //       if(response.status==204)//when server will perform DELETE operation i.e logout
  //       {
  //         return Object.assign({name: 'server did not send anything'},{serverUri: environment.serverUri});//sending dummy data
  //       }
  //       return Object.assign(response.json(), {
  //         serverUri: environment.serverUri
  //       });
  //     })
  //     .catch((err) => this.handleError(err));
  // }

  handleError(error: Response) {
    if (error.status === 401) {
      window.localStorage.clear();
      window.location.href = environment.login_url;
    }
    return Observable.throw(error || { '_body': 'Server error' });
  }

  private requestBuilder(requestObject: any, reqType: string): Request {
    let method: RequestMethod;
    switch (requestObject.method) {
      case 'GET':
        method = RequestMethod.Get;
        break;
      case 'POST':
        method = RequestMethod.Post;
        break;
      case 'PUT':
        method = RequestMethod.Put;
        break;
      case 'PATCH':
        method = RequestMethod.Patch;
        break;
      case 'DELETE':
        method = RequestMethod.Delete;
        break;
      default:
        throw new Error('Property `method` is required for `http request`');
    }
    const headers = new Headers();
    headers.append('Content-Type', 'application/json');

    const access_token = window.localStorage.getItem('token') || null;

    switch (requestObject.wukla) {
      case 'false': // if using wukla APIs
        this.baseUrl = environment.serverUri;
        break;
      default: // for calls with server token
        this.baseUrl = environment.wuklaServerUri;
        // const access_token = window.localStorage.getItem('consumer_token') || null;

    }

    const data = Object.assign({}, requestObject.data);
    if (reqType === 'server') {

      // const access_token = window.localStorage.getItem('token') || null;
      // if (access_token) {
        // headers.append('Authorization', 'JWT ' + access_token);
      // }

      headers.append('X-CSRFToken', this.cookieService.get('csrftoken'));

        const request: Object = {
          method: method,
          url: (this.baseUrl + requestObject.url),
          headers: headers,
          body: JSON.stringify(data),
          withCredentials: true,
        };
        return new Request(new RequestOptions(request));
    } else if (reqType === 'consumer-uuid') {

    // const access_token = window.localStorage.getItem('consumer_token') || null;
    // if (access_token) {
      // headers.append('Authorization', 'JWT ' + access_token);
    // }

      headers.append('X-CSRFToken', this.cookieService.get('csrftoken'));

      const request: Object = {
        method: method,
        url: (this.baseUrl + '/profile/' + this.getUUID() + requestObject.url),
        headers: headers,
        body: JSON.stringify(data),
        withCredentials: true,
      };
      return new Request(new RequestOptions(request));
    } else if (reqType === 'consumer') {

      // const access_token = window.localStorage.getItem('consumer_token') || null;
      // if (access_token) {
      //   headers.append('Authorization', 'JWT ' + access_token);
      // }

      headers.append('X-CSRFToken', this.cookieService.get('csrftoken'));

        const request: Object = {
          method: method,
          url: (this.baseUrl + requestObject.url),
          headers: headers,
          body: JSON.stringify(data),
          withCredentials: true,
        };
        return new Request(new RequestOptions(request));
    }

  }

  // upload on connect
  uploadFile(url, data) {

    const headers = new Headers();
    headers.append('X-CSRFToken', this.cookieService.get('csrftoken'));

    const request: Object = {
      method: 'POST',
      url: (environment.serverUri + url),
      headers: headers,
      body: data,
      withCredentials: true,
    };
    return this.http.request(new Request(new RequestOptions(request)))
      .map(response => {
        return Object.assign(response.json(), {
          serverUri: environment.serverUri
        });
      })
      .catch((err) => this.handleError(err));
  }

  uploadFileToWukla(url, data) {

    const headers = new Headers();
    headers.append('X-CSRFToken', this.cookieService.get('csrftoken'));

    const request: Object = {
      method: 'POST',
      url: (environment.wuklaServerUri + '/profile/' + this.getUUID() + url),
      headers: headers,
      body: data,
      withCredentials: true,
    };
    return this.http.request(new Request(new RequestOptions(request)))
      .map(response => {
        return Object.assign(response.json(), {
          serverUri: environment.serverUri
        });
      })
      .catch((err) => this.handleError(err));
  }

  downloadFile(url): Observable<Blob> {

    const headers = new Headers();
    headers.append('Content-Type', 'application/pdf');
    headers.append('X-CSRFToken', this.cookieService.get('csrftoken'));

    const request: Object = {
      method: 'GET',
      url: (environment.wuklaServerUri + '/profile/' + this.getUUID() + url),
      headers: headers,
      body: JSON.stringify({}),
      responseType: ResponseContentType.Blob,
      withCredentials: true,
    };

    return this.http.request(new Request(new RequestOptions(request)))
      .map(res => res.blob())
      .catch((err) => this.handleError(err));

  }

  getUUID() {
    return window.localStorage.getItem('uuid') || null;
  }

}

EDIT Вот массив вопросов в объекте отклика на вкладке console.log.

questions: Array(4)
0:
help_text: "From which date do you want to start the Non Disclosure Agreement?"
required: true
slug: "agreement_date"
type: "DatePicker"
__proto__: Object
1:
help_text: "For how long should this NDA be for?"
required: true
slug: "agreement_validity"
type: "NumberYears"
__proto__: Object
2:
questions: (3) [{…}, {…}, {…}]
side_text: "Second Party Information"
__proto__: Object
3:
questions: (6) [{…}, {…}, {…}, {…}, {…}, {…}]
side_text: "Non Disclosure Agreement details"
__proto__: Object
length: 4
__proto__: Array(0)

и вот массив вопросов из ответа на вкладке сети.

questions: [{questions: [{slug: "agreement_date", type: "DatePicker", required: true,…},…],…},…]
0: {questions: [{slug: "agreement_date", type: "DatePicker", required: true,…},…],…}
questions: [{slug: "agreement_date", type: "DatePicker", required: true,…},…]
side_text: "General Information"
1: {questions: [,…], side_text: "First Party Information"}
questions: [,…]
side_text: "First Party Information"
2: {questions: [,…], side_text: "Second Party Information"}
questions: [,…]
side_text: "Second Party Information"
3: {,…}
questions: [{slug: "nda_purpose", type: "RadioButton",…}, {slug: "nda_confidentiality", type: "CheckBoxes",…},…]
side_text: "Non Disclosure Agreement details"

Answer 1

Массивы questions одинаковы, когда вы получаете бит console.log(...).Тем не менее, он обновляется в режиме реального времени (проверьте маленькую i информацию на вашей консоли только по объекту:

Это скажет что-то вроде«значение, указанное ниже, было оценено прямо сейчас», то есть это не значение при его печати, а значение при открытии объекта на консоли.

Если вы хотите, чтобы он был таким же, когда вы печатаетеэто, вы должны напечатать его копию:

console.log(JSON.parse(JSON.stringify(object));

---

На тот случай, если вы не знаете, где вы его модифицируете, это здесь:

    this.questionsarray = response['questions'];
    let i = 0;
    for (const section  of this.questionsarray) {
      for (const question of section.questions) {
        this.questionsarray[i] = question;
        i++;
      }
    }

this.questionarray и response.questions - это один и тот же массив, поэтому, так как вы модифицируете один, вы модифицируете оба.