Переменная области Angular 1.5 не определена в обратном вызове успеха службы $http

Учитывая следующий контроллер компонентов Angular 1.5...

'use strict'

 function MyController($http){

    //The template variable for cloning on a form
    this.myVarTemplate = {};
    //The Data I wish to send to the server
    this.myVarTemplate.data = {};
    //Other form specific / callback data
    this.myVarTemplate.meta = {};
    this.myVarArray = [];
    //A container of raw data I'm parsing for example, on whitespace bound to a text input
    this.rawInput = '';

    this.parse = function(){
        var temp = this.rawInput.split(' ');
        for( var i = 0; i < temp.length; i++){
            var container = angular.copy(this.myVarTemplate);
            container.data = temp[i];
            this.myVarArray.push(container);
        }
    }

    this.upload = function(){
        for(var i = 0; i < this.myVarArray.length; i++){
            $http({
                method: 'POST',
                url: <url here>,
                data: this.myVarArray[i]
            }).then(function(response){
                //My Success callback won't work!!!!
                //Response logs successfully, data is retrieved
                console.log(response);
                //this.myVarArray.meta is undefined??
                //console.log(this.myVarArray) is undefined
                this.myVarArray[i].meta.reply = response.data;
            }, function(message){
                //Never been an issue here
                alert('Something Bad happened? doesn't happen');
            }).finally(function(){
                //Works
                this.myVarArray[i].meta.wasSent = true;
            });
        }
    }
})

Я пытаюсь вернуть пакет результатов запроса AJAX в соответствующие объекты формы. Кажется, что this.myVarArray не определен в контексте обратного вызова службы $http. Почему это? Это причуда Angular или самого Javascript? Я понимаю, что служба $http возвращает обещание, но это должно быть разрешено в контексте обратного вызова. Почему myVarArray не определен?

Заранее большое спасибо за любую информацию.

Отредактировано: исправлен мой пример кода... :)


person NetSaber777    schedule 08.04.2016    source источник
comment
Опубликуйте точное и полное сообщение об ошибке, которое вы получите.   -  person JB Nizet    schedule 09.04.2016
comment
Я больше не получаю ошибку. Однако ответ не возвращается объекту массива. Выложу код обновления через секунду   -  person NetSaber777    schedule 09.04.2016


Ответы (1)


this.myVarArray — это массив строк, основанный на том, что было отделено от необработанного ввода в вашем синтаксическом анализе. Вы пытаетесь присвоить свойство объекта (.meta) элементу строкового массива. Вы можете попробовать что-то вроде:

this.myVarObjArray;
this.rawInput = '';

this.parse = function(){
    var temp = this.rawInput.split(' ');
    var valArray = []
    for( var i = 0; i < temp.length; i++){
        valArray.push(angular.copy(temp[i]));
        this.myVarObjArray[i] = { val: valArray};
    }

}

this.upload = function(){
    angular.forEach(this.myVarObjArray, function(obj,v){
        $http({
            method: 'POST',
            url: <url here>,
            data: obj.val
        }).then(function(response){
            //My Success callback won't work!!!!
            //Response logs successfully, data is retrieved
            console.log(response);
            //this.myVarArray.meta is undefined??
            //console.log(this.myVarArray) is undefined
            obj.meta = {reply :response.data};
....
    })

По сути, вы пытаетесь присвоить свойство объекта элементу строкового массива. Это не сработает. Мой синтаксис не может быть 100%. Если вы потянете плункер, я получу для вас рабочий пример. Это должно привести вас на правильный путь.

person MichaelWClark    schedule 08.04.2016
comment
Круто, спасибо Михаил. Это в сочетании с первоначальной помощью @jb-nizet, похоже, навело меня на правильный путь. Попытка получить пример, с которым я могу поиграть в ближайшее время. - person NetSaber777; 09.04.2016
comment
Получил это работает. Между @jbnizet и вами я также лучше понимаю Angular/js. Большое спасибо. - person NetSaber777; 09.04.2016
comment
Для любого будущего зрителя было два вопроса. Первоначальный ответ JB о продолжительности жизни итеративных переменных внутри цикла требует использования forEach вместо for(){} в случаях использования обещаний/других асинхронных операций. Затем @MichaelWClark обнаружил, что я неправильно присвоил ответ переменной Controller. - person NetSaber777; 09.04.2016