HTTP-метод подписки Angular неправильно назначает переменные экземпляра - PullRequest
Новая
       6

HTTP-метод подписки Angular неправильно назначает переменные экземпляра

0 голосов
/ 11 апреля 2019 
 private getAllData(): void {
    this.stamm_solvara_jahrService.getAll().subscribe(resp => {
        const keys = resp.headers.keys();
        this.headers = keys.map(key=> `${key}: ${resp.headers.get(key)}`);
        this.stamm_solvara_jahrData = {...resp.body};

        console.log('Data inside method');
        console.log(this.stamm_solvara_jahrData);
        console.log('Header inside method'); 
        console.log(this.headers);
    });
    console.log('Data outside method');
    console.log(this.stamm_solvara_jahrData);
    console.log('Header outside method');
    console.log(this.headers);
}

Таким образом, внутри подписки 'process' обе переменные экземпляра this.stamm_solvara_jahrData и this.headers имеют значение. За пределами этого они оба пусты. Как можно решить это?

Ответы [ 2 ]

3 голосов
/ 11 апреля 2019

this.stamm_solvara_jahrService.getAll() - это асинхронный метод, поэтому вам нужно вызвать subscribe для него.

Следовательно, this.stamm_solvara_jahrData и this.headers будут определены при выполнении обратного вызова подписки, но остальная часть кода (вне подписки) не ждет , чтобы это произошло , он просто попытается вывести эти две переменные, которые все равно будут undefined.

Я бы настоятельно рекомендовал прочитать об асинхронный и синхронный код , чтобы лучше понять, почему такие вещи происходят в языке, подобном javascript.

1 голос
/ 11 апреля 2019

Это ПРАВИЛЬНО, потому что ВНЕ блока subscribe переменные являются ПУСТЫМИ, потому что вы выполняете ASYNC CALL (AJAX), поэтому ваш фрагмент кода ВНЕ, кроме подписки, будет выполняться ДО возвращения запроса. После того, как вызов возвращен (успешно или нет), выполняемый код будет тот, который ВНУТРИ функции .subscribe, поэтому 

    this.stamm_solvara_jahrService.getAll().subscribe(resp => {
            const keys = resp.headers.keys();
            this.headers = keys.map(key=> `${key}: ${resp.headers.get(key)}`);
            this.stamm_solvara_jahrData = {...resp.body};

            console.log('Data inside method');
            console.log(this.stamm_solvara_jahrData);
            console.log('Header inside method'); 
            console.log(this.headers);
        });

P.S. если вы хотите ЗАПИСАТЬ, то в ответе на ошибку установите новую функцию в качестве второго аргумента вашей функции подписки как: 

  this.stamm_solvara_jahrService.getAll().subscribe(resp => {
            const keys = resp.headers.keys();
            this.headers = keys.map(key=> `${key}: ${resp.headers.get(key)}`);
            this.stamm_solvara_jahrData = {...resp.body};

            console.log('Data inside method');
            console.log(this.stamm_solvara_jahrData);
            console.log('Header inside method'); 
            console.log(this.headers);
        }, 
(error)=>{ // <-- this one func catch the error from server
console.log(error)
});

Надеюсь, это поможет вам !!

...