单个控制器中的多个Http请求

时间:2014-09-19 12:53:55

标签: angularjs

var nameSpace = angular.module("MyTutorialApp", []);

nameSpace.controller("MainController", ['$scope', '$http',
    function($scope, $http)
    {
        $http.get("../api/api.php?fxn=" + encodeURIComponent("getCategories") +
                "&jsn=" + encodeURIComponent("{'code':'1'}"))
            .success(function(response)
            {
                $scope.names = response;
            });

        $scope.myData = {};
        nameSpace.controller("MainController", ['$scope', '$http',

        $scope.myData.doClick = function($event, name, $scope, $http,$config)
        {
            alert(name);
            var element = name;
            console.log(element);
            $http.get("../api/api.php?fxn=" + encodeURIComponent("getSubCategories") +
                    "&jsn=" + encodeURIComponent("{'code':'element'}"))
                .success(function(response)
                {
                    $scope.subCat = response;
                });
        }]);

    }
]);

<!DOCTYPE html>
<head>
    <title>Learning AngularJS</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js" type="text/javascript"></script>

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
    <script src="js/maincontroller.js"></script>

</head>
<body ng-app="MyTutorialApp" >

    <div ng-controller="MainController"> 

<table class="table">
   <tr class="row1" ng-repeat="list in names.category">
     <td ng-click="myData.doClick($event,list.name)">{{ list.name }}</td> 
   </tr>
</table>
</div>



</body>
</html>

嗨,我无法发出第二个http请求,它说get property undefined。我一直试着,我无法发现出了什么问题。请帮助我。我刚刚开始使用角度。 为了解释我想要实现的目标,第一个http请求调用类别列表,填充列表,然后在点击任何类别时,该类别作为第二个http请求的jsn发送。它获取子类别

1 个答案:

答案 0 :(得分:3)

检查

// Code goes here
var nameSpace = angular.module("MyTutorialApp", []);
nameSpace.factory('factoryRefrence', ['$http', '$q',
  function($http, $q) {
    return {
      getCategories: function() {
        var deferred = $q.defer();
        $http.get("../api/api.php?fxn=" + encodeURIComponent("getCategories") +
            "&jsn=" + encodeURIComponent("{'code':'1'}"))
          .success(function(response) {
            deferred.resolve(response);
          });
        return deferred.promise;
      },
      getsubCategories: function(element) {
        var deferred = $q.defer();
        $http.get("../api/api.php?fxn=" + encodeURIComponent("getSubCategories") +
            "&jsn=" + encodeURIComponent({
              'code': element
            }))
          .success(function(response) {
            deferred.resolve(response);
          });
        return deferred.promise;
      }
    }
  }
]);
nameSpace.controller("MainController", ['$scope', '$http', 'factoryRefrence',
  function($scope, $http, factoryRefrence) {

    factoryRefrence.getCategories().then(function(response) {
      $scope.names = response;
    });

    $scope.myData = {};
    $scope.myData.doClick = function(event, name) {
      alert(name);
      var element = name;
      console.log(element);
      factoryRefrence.getsubCategories().then(function(response) {
        $scope.subCat = response;
      });
    }
  }
]);

<强> Demo

这是与工厂中的功能进行通信的方式。如果你这样设置它应该工作正常。除了在你的代码中,你定义了两次控制器,这是不行的。