Question

我正在切换到Angular-ui模式，我对如何进行$ http get调用并返回结果感到困惑。我一直在使用与当前代码不同的角度模态。我理解这是有效的，但我需要一些过渡的帮助。谢谢这是我目前使用的模式。这很好用。我需要将它应用于Angular-UI模式

$scope.editCivilCaseModal = function (id) {
      var deferred = $q.defer();
      $http({ method: 'get', url: '/api/apiCivilCase/' + id })
              .success(function (civilCase) {
                  deferred.resolve(civilCase);
                  console.log(civilCase);
                  $scope.active = civilCase;
                  $scope.openEditCivilCaseModal = $ekathuwa.modal({
                      scope: $scope,
                      contentPreSize: "lg",
                      templateURL: "views/modals/editCivilCaseModal.html"

                  });
                  //show modal window
                  $scope.openEditCivilCaseModal.then(function (m) {
                      m.modal('show');
                  });
              }).error(function (error) {
                  deferred.reject(error);
              });
      return deferred.promise;
  }

需要切换到此

  .controller('ModalDemoCtrl', function ($scope, $modal, $log) {
  $scope.items = ["item1", "item2", "item3"];

  $scope.open = function (id) {
    var modalInstance = $modal.open({
        templateUrl: "views/modals/editCivilCaseModal.html",
        controller: 'ModalInstanceCtrl',
        resolve: {
            items: function () {
                return $scope.items;
            }
        }
    });
    modalInstance.result.then((function (selectedItem) {
        $scope.selected = selectedItem;
    }), function () {
        $log.info("Modal dismissed at: " + new Date());
    });
  };
 }
   ).controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {
  $scope.items = items;
  $scope.selected = {
    item: $scope.items[0]
  };
  $scope.ok = function () {
    $modalInstance.close($scope.selected.item);
  };
   $scope.cancel = function () {
    $modalInstance.dismiss("cancel");
  };
}

根据建议的解决方案解决方案

  //Edit Civil Modal
$scope.editCivilCaseModal = function (id) {
    var deferred = $q.defer();
    $http({ method: 'get', url: '/api/apiCivilCase/' + id })
            .success(function (civilCase) {
                deferred.resolve(civilCase);
                console.log(civilCase);
                $scope.active = civilCase;
            }).error(function (error) {
                deferred.reject(error);
            }).then(function () {

                $modal.open({
                    templateUrl: "views/modals/editCivilCaseModal.html",
                    controller: 'ModalInstanceCtrl',
                    resolve: {
                        active: function () {
                            return $scope.active;
                        }
                    }
                });

            })
    return deferred.promise;
}


 .controller('ModalInstanceCtrl', function ($scope, $modalInstance, active) {
    $scope.active = active
    $scope.ok = function () {
    $modalInstance.close();
   };
    $scope.cancel = function () {
    $modalInstance.dismiss("cancel");
   };
 });

Answer 1

你应该拆分你的$ http电话

$scope.editCivilCaseModal = function (id) {
      var deferred = $q.defer();
      $http({ method: 'get', url: '/api/apiCivilCase/' + id })
              .success(function (civilCase) {
                  deferred.resolve(civilCase);
                  console.log(civilCase);
                  $scope.active = civilCase;
              }).error(function (error) {
                  deferred.reject(error);
              });
      return deferred.promise;
  }

并且http的成功做任何你喜欢的打开模型。

$scope.editCivilCaseModel().then(function(){

               $scope.openEditCivilCaseModal = $ekathuwa.modal({
                      scope: $scope,
                      contentPreSize: "lg",
                      templateURL: "views/modals/editCivilCaseModal.html"

                  });
                  //show modal window
                  $scope.openEditCivilCaseModal.then(function (m) {
                      m.modal('show');
                  });

})

这只是为了给你这个概念，因为我无法看到现在和预期之间的确切关系。

如何使用Angular-ui模式实例进行服务调用

1 个答案: