Вопрос о последовательности выполнения функции AngularJS

#angularjs #visual-studio

#angularjs #visual-studio

Вопрос:

Я использую вызывающую функцию Save_Click в контроллере Angular при нажатии кнопки.

Ниже приведена последовательность выполнения

 Line Code 
1    Declare a variable V1 
2    console.log(V1) 
3    Perform a server post back, and assign a value to V1 depending on the values the service returns. console.log(V1)
4 console.log(V1) 
  

Я вижу, что — в консоли # 4 печатается раньше — # 3
Также значение, присвоенное в # 3, не напечатано в # 4.

В чем может быть причина? Что я делаю не так? Я получаю ту же проблему, если я также использую библиотеку $ localStorage (ngStorage).

Примечание — я использую решение Visual Studio / .Net для размещения приложения angular в моем Index.cshtml.

Комментарии:

1. Это естественное поведение асинхронного кода. Некоторые блоки кода, такие как служба http, события являются асинхронными. Когда блок асинхронного кода достигает # 3 в вашем случае, программа вызовет этот оператор и продолжит выполнение следующего оператора, код против асинхронного кода будет выполнен после завершения асинхронной операции. Вот почему # 4 (не асинхронный) предшествует # 3 (асинхронный код).

2. Как убедиться, что асинхронный код выполняется первым?

3. Чтобы сделать это, вам нужно прервать асинхронное поведение. ES6 предоставляет async и await функцию. javascript.info/async-await

4. await будет ждать завершения операции. Пожалуйста, убедитесь, что await будет работать только внутри асинхронной функции

5. использование следующего — для сервисной функции, похоже, не вносит изменений. CallAPI: асинхронная функция (serviceUrl, objectToSerialize) { переменный URL = window. расположение.протокол «//» окно. Расположение. имя хоста «:94/api/Message/» serviceUrl «/»; console.log(url); var req = { метод: ‘PUT’, url: url , данные: objectToSerialize }; возврат ожидает $http(запрос); }

Ответ №1:

Используйте следующий метод

 1    Declare a variable V1 
2    console.log(V1) 
3    async (Perform a server post back, and assign a value to V1 depending on the values the service returns. await console.log(V1))
4    console.log(V1) 
  

Теперь # 3 будет печататься перед # 4

Ответ №2:

Наконец-то у меня получилось.

 

var x = {};
            
                    x.1 = '1';
                    x.2 = '2';
                   
                    MyService.CallAPI('RunRabbit', x).success(function (data) {
                        if (data === null) {
                            $scope.error = true;
                            $scope.errorDescription = "No data found for selected criteria.";
                            
                        } else {
                           
                            $scope.answer = data.answer;
                           
                        }
                    }).error(function () {

                    }).finally(function () {
                        console.log($scope.answer);
                    });

  

Я мог бы оценить $scope.answer, а затем использовать его синхронно с finally.