AngularJS обещают не устанавливать «это» должным образом

Question

AngularJS обещают не устанавливать «это» должным образом

0

Я пытаюсь предварительно заполнить список выбора данными из файла JSON.

контроллер

this.langs = [];
var promise = $lcidFactory.getLCIDS();
promise.then(
    function(payload){
        this.langs = payload.data;
        console.log(payload.data);
    },
    function(error){
        alert("[Error] "+error);
    }
);

Когда я просматриваю консоль с инспектором, появляются данные. Однако следующий код создает пустой JSON, {}.

HTML

<template-editor-form model="cpCtrl.data">
    ...
    <pre>{{ cpCtrl.langs | json }}</pre>
    ...
</template-editor-form>

Если я установил this.langs = [] в строке 1 контроллера на this.langs = ["one"] шаблон правильно отражает изменения, поскольку ["langs": ["one"]]

EDIT Этот вопрос похож на Как работает ключевое слово this? , однако этот вопрос затрагивает одну из общих проблем использования this в контексте AngularJS в сжатом виде.

Glenn Dayton 18 июль 2016, в 17:21

Источник

2

Возможный дубликат Как работает ключевое слово "this"?
Grundy 18 июль 2016, в 15:03

Теги:

angularjs

json

5 ответов

3

Другим решением может быть привязка контекста к функции, которая обеспечивает ограниченную функцию.

this.langs = [];
var promise = $lcidFactory.getLCIDS();
promise.then(
    function(payload){
        this.langs = payload.data;
        console.log(payload.data);
    }.bind(this), 
    function(error){
        alert("[Error] "+error);
    }
);

Hamlet Hakobyan 18 июль 2016, в 12:49

2

this window в свободном режиме или undefined в строгом режиме в функциях обратного вызова. Это можно исправить

используя bind ES5 ( angular.bind может использоваться вместо старых браузеров)

promise.then(
    function(payload){
        this.langs = payload.data;
    }.bind(this),
    ...

используя функцию стрелки ES6

promise.then(
    (payload) => {
        this.langs = payload.data;
    },
    ...

присвоение this переменной другой переменной в области родительской функции

var _this = this;

promise.then(
    function(payload){
        _this.langs = payload.data;
    },
    ...

estus 18 июль 2016, в 13:32

0

Вы должны хранить внешнее this в переменной, такой как var that = this, а внутри обработчика разрешений используется.langs that.langs = payload.data.

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

Rachmaninoff 18 июль 2016, в 13:33

0

this в JavaScript немного странно (или отличается от другого языка) и область применения, связанные, я предложить https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

для вашего кода:

this.langs = [];

var base = this;

var promise = $lcidFactory.getLCIDS();
promise.then(
    function(payload){
        base.langs = payload.data;
        console.log(payload.data);
    },
    function(error){
        alert("[Error] "+error);
    }
);

hayatoShingu 18 июль 2016, в 12:38

Ещё вопросы

Возможный дубликат Как работает ключевое слово "this"?

Daniel Ziegler · Accepted Answer · 2016-07-18T13-16-00.000Z

Ну, я думаю, ваша проблема в том, что "это" в вашей функции не является тем же "этим" вне функции. Вы можете установить "вне этого" в переменную, чтобы вы могли использовать эту переменную для доступа к вашим языкам даже в функции обратного вызова.

var self = this;
this.langs = [];
var promise = $lcidFactory.getLCIDS();
promise.then(
    function(payload){
        self.langs = payload.data;
        console.log(payload.data);
    },
    function(error){
        alert("[Error] "+error);
    }
);

Круто, что сделал это! Глупая ошибка! Спасибо