Использование решимости для ожидания результатов RESTful в angularjs $ modal - PullRequest
0 голосов
/ 04 июня 2019

Я работаю над устаревшим кодом, который использует angularjs 1.x для веб-интерфейса.Мне нужно создать модальное диалоговое окно, которое будет делать вызов RESTful для бэкэнда при открытии модального окна и ждать возвращения данных перед рендерингом представления.

Мне удалось выяснить большинство из того, что янужно было сделать, но есть одна вещь, которую я до сих пор не могу обернуть вокруг.Насколько я понимаю, мне нужно было использовать 'resolv' для определения функции, которая возвращала бы $ обещание контроллеру.Когда я устанавливаю точку останова внутри моего контроллера, параметр является объектом, содержащим обещание, статус разрешения и, наконец, мои фактические данные.

Я могу извлечь нужные данные из этого объекта, но он чувствуеткак будто я не должен был этого делать.Мой контроллер не заботится о самом обещании;только данные, которые были возвращены.Есть ли какой-то способ структурировать это так, чтобы только данные отправлялись в контроллер, или именно так должны вести себя угловые модалы?

Пример моего кода:

$scope.openTerritorySelect = function () {

                var modalInstance = $modal.open({
                    animation: true,
                    templateUrl: 'prospect/detail/selectTerritoriesModal.tpl.html',
                    controller: function($scope, $modalInstance, availableReps){

                        $scope.reps = availableReps;
                        $scope.ok=function()
                        {
                            $modalInstance.close();
                        };

                        $scope.cancel=function()
                        {
                            $modalInstance.dismiss('cancel');
                        };
                    },
                    resolve: {
                        availableReps: function () {
                           return Prospect.getRelatedReps({}, function (data, header) {
                                $scope.busy = false;
                                return data.result;

                            }, function (response) {
                                $scope.busy = false;

                                if (response.status === 404) {
                                    $rootScope.navError = "Could not get reps";
                                    $location.path("/naverror");
                                }

                            }).$promise;

                        }
                    }

                });

                modalInstance.result.then(function (selectedReps) {

                }, function () {
                    console.log('Modal dismissed at: ' + new Date());
                });
            };

Класс обслуживания «Проспект»:

angular.module('customer.prospect', [ "ngResource" ]).factory('Prospect', [ 'contextRoute', '$resource', function(contextRoute, $resource) {
    return {

        getRelatedReps : function(args, success, fail) {

            return this.payload.getRelatedReps(args, success, fail);
        },

        payload : $resource(contextRoute + '/api/v1/prospects/:id', {

        }, {

            'getRelatedReps' : {
                url : contextRoute + '/api/v1/prospects/territories/reps',
                method : 'GET',
                isArray : false
            }
        })
    };

} ]);

1 Ответ

0 голосов
/ 04 июня 2019

Вы можете значительно упростить ситуацию, сделав запрос REST еще до того, как откроете модальное окно.Хотели бы вы открыть модал, если запрос потерпит неудачу?

$scope.openTerritorySelect = function () {
  Prospect.getRelatedReps({}, function (data, header) {
    $scope.busy = false;
    var modalInstance = $modal.open({
      animation: true,
      templateUrl: 'prospect/detail/selectTerritoriesModal.tpl.html',
      controller: function($scope, $modalInstance, availableReps){
        $scope.reps = availableReps;
         $scope.ok = function() {
           $modalInstance.close();
         };
         $scope.cancel = function() {
           $modalInstance.dismiss('cancel');
         };
       },
       resolve: {
         availableReps: function () {
           return data.result;
       }
    });

    modalInstance.result.then(function (selectedReps) {}, 
      function () {
        console.log('Modal dismissed at: ' + new Date());
      });
  }, function (response) {
    $scope.busy = false;

    if (response.status === 404) {
      $rootScope.navError = "Could not get reps";
      $location.path("/naverror");
    }

 });
};
...