Члены $ scope не обновляются после вызова функции с $ http

0

Я работаю над обновлением другого проекта с помощью AngularJS. У меня проблема, когда переменные $scope.script и $scope.workInstruction не обновляются после вызова моей функции $scope.dbQuery которая содержит директиву $http.post().

$http.post() успешно, но возвращенные данные не отражаются в моей области $scope

Я ожидаю, что как только $http.post(), скрипт и workInstruction также должны быть обновлены с привязкой данных в 2-х направлениях.

Когда я вызываю метод $http.post() напрямую, а затем присваиваю значения $scope.script и $scope.workInstruction в конце, они обновляются автоматически из-за оболочки. $scope.workInstruction .$apply().

  • Как я могу эмулировать один и тот же ответ, но вызывая функцию с моей текущей настройкой?

Я попытался использовать $scope.$apply(), но не повезло! Возможно, я использовал его неправильно? Я новичок в угловом, поэтому любые советы о том, как получить эти значения для обновления в представлении, будут оценены :)

Вот фрагмент HTML:

<div class="container" ng-controller="results">
        <button ng-click="sendPost()"/>Query!</button>
        <div class="input-group">
            <span class="input-group-addon" id="script-addon" style="width: 100px">Script:</span>
            <textarea class="form-control" name="script" aria-describedby="script-addon">{{ script }}</textarea>
        </div> 

        <div class="input-group">
            <span class="input-group-addon" id="work-addon" style="width: 100px">Work Instruction:</span>
            <textarea class="form-control" name="script" aria-describedby="work-addon">{{ workInstruction }}</textarea>
        </div> 
</div>


Вот AngularJS:

myApp.controller('results', ['$scope', '$http', '$log', function ($scope, $http, $log) {
$scope.url = "php/dbquery.php";
$scope.tool = 'EAMS';
$scope.category = 'Admin';
$scope.sub_category = 'Access';
$scope.issue = 'Account Locked';

$scope.sendPost = function () {

    var data = $.param({
        table: $scope.tool,
        tool : $scope.tool,
        category: $scope.category,
        sub_category: $scope.sub_category,
        issue: $scope.issue
    });

    var config = {
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
        }
    };
    /* THIS IS PROBLEM LOCATION; $scope.script returns undefined */
    $scope.script = $scope.dbQuery($scope.url, data, config);
    $log.info("Script: " + $scope.script);

    var data = $.param({
        table: $scope.tool,
        tool : $scope.tool,
        category: $scope.category,
        sub_category: $scope.sub_category,
        issue: $scope.issue,
        flag: true
    });

    /* THIS IS PROBLEM LOCATION; $scope.workInstruction returns undefined */
    $scope.workInstruction = $scope.dbQuery($scope.url, data, config);        
    $log.info('Work Instruction: ' + $scope.workInstruction);
  }; // End sendPost()

$scope.dbQuery = function dbQuery(url, data, config) {
    $log.debug("In dbuery");
    $http.post(url, data, config)
        .success(function (data, status, headers, config) {
            var result = data[0];
            $log.debug('res: ' + result);
            return result;
        })
        .error(function(data, status, headers, config) {
            var result = 'Bad query: ' + data +
                "<hr />status: "  + status +
                "<hr />headers: " + header +
                "<hr />config: "  + config;
            return result;
        });
    }
}]); // End controller

Вот консольный вывод:

    In dbuery
angular.min.js:107 Script: undefined
angular.min.js:107 In dbuery
angular.min.js:107 Work Instruction: undefined
angular.min.js:107 res: Status: Resolved (No Further Action Required)

User,

Your EAMS account has been reactivated. Please reset your password by using the Forgot Password on the login page.

Please see the Ericsson Password Policy below:

    1) Passwords for individual user accounts shall consist of a minimum of 8 characters, being a combination of at least 3 of the following 4 character types; lowercase, uppercase, numeral and special characters.

    2) Change of passwords shall be enforced every 90 days.

    3) Prevent passwords which are equal to the user ID, ericsson, and Ericsson

    4) Prevent password re-use of 15 generations and allow not more than 3 password changes per day.

    5) Accounts shall be locked after 6 consecutive failed attempts to log in within 30 minutes. Automatic unlock is allowed after 30 minutes.

This ticket is considered closed.

Thank you,
angular.min.js:107 res: Verify account has company email address, company assigned, role(s) assigned & Clear Expire. 

If no roles or company, DO NOT Clear Expire. The account will not work for user. 

Do not unlock if public email address. Send Company email mandatory QP.

If Supplier, and you cannot tell from email address, ask user. 

If Ericsson, try to Lync for additional info. If not available, ask user via email.
Теги:
asynchronous

2 ответа

0
Лучший ответ

Чтобы у меня не было необходимости создавать $http.post() для каждого элемента запроса $scope который мне нужно было получить из моей базы данных, я передал параметр, содержащий то, что я пытался запросить, в мой метод $scope.dbQuery, Это позволило моим обратным вызовам динамически обновлять мое представление и модели соответственно.

    $scope.dbQuery = function dbQuery(url, data, config, member) {
    $log.debug(member);

    $http.post(url, data, config)
        .success(function (data, status, headers, config) {            

            switch (member) {
                case 'tool':
                    $scope.toolSel = data;
                    break;

                case 'category':
                    break;

                case 'subCategory':
                    break;

                case 'issue':
                    break;

                case 'script':
                    $scope.script = data[0];
                    break;

                case 'workInstruction':
                    $scope.workInstruction = data[0];
                    break;

                default:
                    break;
            }
        })
        .error(function(data, status, headers, config) {
            var result = 'Bad query: ' + data +
                "<hr />status: "  + status +
                "<hr />headers: " + header +
                "<hr />config: "  + config;
            $log.error(result);
        });
}
1

$ scope.dbQuery немедленно возвращается, "возврат" от успеха/ошибки - это асинхронный вызов через api. вам следует назначить $ scope.script непосредственно в обработчике обратного вызова успеха

  • 0
    Я хочу иметь возможность использовать эту функцию независимо от того, хочу ли я обновить скрипт, workInstruction и т. Д. Без необходимости писать совершенно новый вызов для каждого члена $ scope. Если я сделаю то, что вы предлагаете, каждому участнику потребуется собственный вызов. Есть ли способ динамически назначать мои элементы области?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню